//html{font-size: 10px;}
/*! 20170608
*/
//@import "../css/normalize.css";

%yahei{
  font-family:Helvetica,arial,\5FAE\8F6F\96C5\9ED1,\9ED1\4F53,'Microsoft YaHei',sans-serif;
}
$mainColorBlue:#1d79d6;
$mainColorOrange:#ff6700;
$mainColorRed:#ea544a;
//$mainColor:#ea544a;
$mainColor:#ff6700;
$mainColorHover: #ed6000;
//$mainColorHover: #c1690d;
$c-ea:#eaeaea;
$c-c:#cccccc;
$c-ec:#ececec;
$c-e5:#e5e5e5;
$c-db:#dbdbdb;
$c-f1:#f1f1f1;
$c-f2:#f2f2f2;
$c-f5:#f5f5f5;
$c-f6:#f6f6f6;
$c-f8:#f8f8f8;
$c-f:#fff;
$c-9:#999;
$c-6:#666;
$c-3:#333;
$c-0:#000;
$c-eggHuang:#ffaf66;

%w100{width: 100%;}
%fl{float:left;}
%fr{float:right;}
%tl{text-align: left;}
%tr{text-align: right;}
%tc{text-align: center;}
%clearfix{clear: fix;
  zoom: 1;
}

.clearfix{
  @extend %clearfix;
}

%dis-inlineblock{
  display: inline-block;
  //display:-moz-inline-stack;
  zoom:1;*display:inline;
}
%hover-bgshadow{
  box-shadow: 0 2px 8px #bbb;
  //box-shadow:  0 1px 2px #c5c5c5;
}


html{font-size: 14px;}
html,body{@extend %yahei;background-color: $c-f2;}
ul,li{list-style: none;margin: 0;padding: 0;}
dl,dt,dd{margin: 0;}
em{font-style: normal;}
strong{font-weight:normal;}
//清除ie中input的叉和小眼睛
::-ms-clear, ::-ms-reveal{display: none;}
:root{}
//通用
.bg-grey{background-color: $c-f2;}
.pull-left{@extend %fl;}
.pull-right{@extend %fr;}
.text-right{@extend %tr;}
.text-left{@extend %tl;}
h3{font-weight: normal;margin: 0;font-size: 1.29rem;}
.row-3{width: 33.3%;float: left;}
.row-4{width: 24.96%;float: left;}
.row-2{width: 49.9%;float: left;}
.row-6{width: 16.66%;float: left;}
//input[placeholder]{color: $c-9;}
//*input[placeholder]{color: $c-0;}
//input[placeholder]:focus{color: $c-0;}
:-ms-input-placeholder{color:$c-9;}
.red{color: $mainColorRed !important;}
.green{color: #8ebd57 !important;}
.text-center{@extend %tc;}
.margintop10{margin-top: 10px;}
cite{font-style: normal;}
.grey{color: $c-9;}


input[type="text"]:focus{border-radius: 5px;}
.error{color: red;font-size: 0.86rem;}
//进度条
.box-column{font-size: 0;
  .column,.column-text,.column-tit{@extend %dis-inlineblock;vertical-align: middle;}
  .column-tit{width: 40px;font-size:1rem;color: $c-6;}
  .column{
    width: 70%;height: 7px;
    background-color: #e5e5e5;
    border-radius:7px;
    position: relative;
    span{border-radius:inherit;background-color: #69d2ca;height: inherit;display: block;
      position: absolute;left: 0;top: 0;
    }
  }
  .column-text{font-size:1rem;color: $c-6;margin-left: 8px;}
}
//新手专享进度条
.box-column{
  .column{
    span{background-color:$mainColor;}
  }
}
//从这里开始新的旅程
a {text-decoration:none;color: $c-3;
  &:visited{text-decoration:none;
    color: $c-3;
  }
  &:hover,&:focus{text-decoration:none;
    color: $mainColor;
  }
  &:active{text-decoration:none;
    color: $c-3;
  }
}

.btn {
  display: inline-block;
  //padding: 9px 12px;
  width: 126px;
  height: 38px;
  line-height: 38px;
  margin-bottom: 0;
  font-size: 1.14rem;
  font-weight: normal;
  //line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 5px;
  &:focus,&:active:focus,
  &.active:focus,
  &.focus,
  &:active.focus,
  &.active.focus{
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
  }
  &:hover,
  &:focus,
  &.focus {
    color: #fff;
    text-decoration: none;
  }
  &:active,
  &.active {
    background-image: none;
    outline: 0;
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
  }
  &.disabled,
  &[disabled],
  fieldset[disabled] .btn {
    background-color: $c-c !important;
    color: $c-f !important;
    //border: $c-db 1px solid !important;
    pointer-events: none;
    cursor: not-allowed !important;
    //filter: alpha(opacity=50) !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    //opacity: .5 !important;
    border: $c-c 1px solid !important;
  }
  &.disabledLink{
    filter: alpha(opacity=50) !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: .5 !important;
  }
}
.btn.btn-default {
  //padding: 9px 30px;
  //outline: none;
  color: $c-f;
  border: $mainColorOrange 1px solid;
  background-color: $mainColorOrange;
}
.btn.btn-default2{
  height: 38px;line-height: 38px;
  font-size: 1rem;
  color: $c-f;
  background-color: $mainColorOrange;
}
.btn.btn-line {
  //padding: 9px 30px;
  color: $mainColorOrange;
  border-color: $mainColorOrange;
  background-color: transparent;
  height: 40px;line-height: 40px;
  font-size: 1rem;
  &:hover,&:focus{
    background-color: transparent;
    color: $mainColorHover;
    border-color: $mainColorHover;
  }
}
.btn.btn100{
  width: 100%;
}
a.btn-default{color: $c-f;}
.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active{
  //outline: none;
  transition:background-color .5s;
  border-color: $mainColorHover;
  background-color: $mainColorHover;
}



//首页
.container{width: 1080px;margin: 0 auto;}
//首页头部
header{
  //height: 130px;
  background-color: $c-f;
}
.topbar{height: 40px;line-height: 40px;
  font-size: 1rem;background-color:$c-3;
  @extend %tr;
  color:rgba($c-f,0.5);
  *color: $c-f;
  a{color:rgba($c-f,0.5);
    *color: $c-f;
    padding: 0 30px;
    &:hover,&:focus{color: $c-f;
      //text-decoration: underline;
    }
    &.topbarLast{padding-right: 0;}
    &.topbarAappIssued{
      position: relative;
      z-index: 10;
      &:hover{
        .appIssuedEwmBox{
          display: block;
        }
      }
      .appIssuedEwmBox{
        display: none;
        color: $c-6;
        text-align: center;
        position: absolute;
        top:28px;left:50%;
        margin-left: -75px;
        border: 1px $c-db solid;
        width: 150px;
        height:170px;
        background-color: #fff;
        // box-shadow: 0 0 5px $c-db;
        img{display: inline-block;width: 90%;
          margin-top: 8px;
        }
        &:after,&:before{
          position: absolute;
          content: '';
          top:-5px;left: 50%;
          margin-left: -8px;
          width: 0;
          height: 0;
          border-left: 6px solid transparent;
          border-right: 6px solid transparent;
          border-bottom: 6px solid $c-f;
        }
        &:before{
          border-bottom: 6px solid $c-db;
          top:-7px;
        }
      }
      .ewmText{
        line-height: 0px;
        margin-top: -8px;
      }
    }
  }
  .loginAfter,.logins{display: none;
    &.active{
      @extend %dis-inlineblock;//vertical-align: middle;
    }
  }
  .loginAfter{
    padding-right: 20px;
    a{padding:0 6px;}
  }
  //.active{color: $mainColor;}
}
.main-hd{height: 80px;
  position: relative;z-index: 9;
  @at-root .logo{display: block;
    @extend %fl;
    width: 173px;height: 50px;
    margin-top: 14px;
    background:url("../images/logo.png") no-repeat;
    background:url("../images/logo.svg"),none;
  }
  .slogan{width: 192px;height: 35px;
    background: url("../images/slogan2.png") no-repeat;
    @extend %fl;
    margin: 24px 0 0 22px;
  }
  .primaryNavigation{@extend %clearfix;}
  nav{
    @extend %fr;
    margin-top:32px;
    //margin-right: -40px;
  }
  ul.nav-top{
    & > li{
      //@extend %dis-inlineblock;
      @extend %fl;
      @extend %tc;
      margin: 0 24px;
      //width: 84px;
      border-bottom: 3px solid transparent;
      height: 45px;
      position: relative;
      &.shortNav{//短标题
        width: 50px;
      }
      &.active{
        &>a{
          color: $mainColorOrange;
        }
        border-bottom-color:$mainColorOrange;
      }
      &:hover{
        //cursor: pointer;
        ul.nav-top2{
          display: block;
        }
        &>a{color: $mainColorOrange;}
      }
      &>a{display: block;
        height:50px;
        width: 100%;
        font-size: 1.285rem;
        &:hover{
          transition: color .2s;
          color: $mainColorOrange;
          //border-bottom: 2px solid $mainColor;
        }
      }
      ul.nav-top2{
        display: none;
        border: 1px solid #f4f4f4;
        border-top: 3px solid $mainColorOrange;
        position: absolute;
        width: 110px;
        left: 50%;margin-left: -55px;
        top:100%;
        padding: 14px 0 10px 0;
        background-color: $c-f;
        &>li{
          width: 100%;
          height: 30px;line-height: 30px;
          background-color: $c-f;
          text-align: left;
          text-indent: 2em;
          margin-bottom: 8px;
          &:hover{background-color:$mainColorOrange;
            &>a{color: $c-f;}
          }
          &>a{font-size: 16px;
            display: block;
            height:30px ;
          }
        }
      }
      .hot{
        display: block;
        position: absolute;
        width: 31px;
        height:13px;
        background: url("../images/hot.gif") no-repeat;
        top:-13px;right: 0;
      }
      .newIcon{
        display: block;
        position: absolute;
        width: 30px;
        height:16px;
        background: url("../images/new.png") no-repeat;
        top:-8px;right: -28px;
      }
    }
  }
}
//首页banner
.index-banner{height: 412px;position: relative;
  z-index: 0;
  &.landing{
    .reg-block{
      height: 386px;
      width: 324px;
      margin: -193px 0 0 215px;
      background-color: rgba($c-f,0.85);
      .landingReg-body{
        margin:21px 20px;
      }
      .landing-reg-row{
        height: 40px;
        position: relative;
        white-space: nowrap;
        &.text-row{
          height: auto;
        }
      }
      .landingInput{
        height: 36px;
        line-height: 36px;
        border: $c-db 1px solid;
        border-radius: 4px;
        width: 282px;
        text-indent: 10px;
        &.landingInputHalf{
          width: 176px;
        }
      }
      .error{
        height: 22px;line-height: 22px;
      }

      .yzm{
        right: 0;
        width: 102px;
      }
      .btn-yzm{
        position: absolute;
        right: 0;
        top:0;
        width: 100px;
        font-size: 1rem;
      }
      .btn100{
        margin-top: 20px;
      }
    }
  }
  .reg-block{
    color: $c-3;
    position: absolute;
    z-index: 2;
    top:50%;
    left: 50%;
    width: 360px;height: 300px;
    margin: -150px 0 0 180px;
    .reg-block-bg{
      position: absolute;
      top:0;left: 0;
      width: 100%;height:100%;
      background-color:$c-f;
      opacity: 0.8;
      filter: alpha(opacity=80);
    }
    .reg-block-con{
      position: absolute;
      top:0;left: 0;
      width: 100%;height:100%;
      @extend %tc;
    }
    dl{margin:40px 0 0 0;
      dt{font-size: 16px;}
      dd{font-size: 4.5rem;color: #fd7e30;
        margin-top: 10px;
        em{font-size: 2rem;}
        span{font-size: 1.25rem;color: $c-6;}
      }
    }
    p{margin-top: 5px;font-size: 16px;
      letter-spacing:2px;
    }
    .btn-reg-block{
      font-size: 1.571rem;
      width: 72%;
      height: 50px;line-height: 50px;
      margin:16px 45px 0 45px;
      color: $c-f;
    }
  }
  //banner切换
  .flexslider{margin: 0;border: 0;
    box-shadow: none;
    ul.slides{
      li{height: 412px;@extend %tc;}
      a{display: block;}
      img{width: auto;display: inline;}
    }
    //小圆点
    .flex-control-nav{
      bottom: 20px;z-index: 2;
      //margin-left: -465px;
      li{margin: 0 8px;}
    }
    .flex-control-paging li a{
      background-color: rgba($c-0,0.5);
      width: 12px;height: 12px;
      &:hover{
        background-color: rgba($c-0,1);
      }
      &.flex-active{
        background-color: rgba($c-f,0.5);
        box-shadow: none;
      }
    }
  }

}
.orange{color: $mainColorOrange;}
//首页数据中心
.dataCenter{
  height: 54px;line-height: 54px;
  background-color: $c-f;
  border-bottom: 1px solid $c-ec;
  @extend %clearfix;
  ul.dataCenterListUl{font-size: 1rem;color: $c-6;
    li{@extend %fl;@extend %tc;
      .orange{font-size: 18px;padding-left: 6px;}
      &.li1{width:200px;@extend %tl;}
      &.li2{width: 340px;}
      &.li3{width: 300px;}
      &.li4{width: 240px;@extend %tr;}
    }
  }
}
//首页产品简易信息
dl.simple-proinfoDL{//图标简易信息介绍
  @extend %dis-inlineblock;margin-right: 60px;
  dd{font-size: 2.36rem;color: $c-6;
    em{font-size: 1.7rem;text-indent: -2px;}
  }
  dt{
    font-size: 1rem;
    color: $c-3;
  }
  &:first-child dt{text-indent: 4px;}
}
dl.simple-prointrDL{
  @extend %dis-inlineblock;vertical-align: middle;
  dt{color: $c-3;font-size: 1.29rem;}
  dd{color: $c-6;font-size: 1rem;margin-top: 8px;line-height: 1.4rem;}
}
.icon50{
  width: 50px;height: 50px;
  @extend %dis-inlineblock;
  background:url("../images/index/icon50.png") -9999px -9999px no-repeat;
  vertical-align: middle;
  &.icon-security{
    background-position: 0 0;
  }
  &.icon-major{
    background-position: 0 -50px;
  }
  &.icon-transparent{
    background-position: 0 -100px;
  }
}
.index-simple-pro{//首页：安全、专业、透明的介绍
  margin-top: 20px;
  @extend %clearfix;
  .index-simple-proCon{
    @extend %fl;
    background-color: $c-f;
    height: 162px;
    width: 347px;
    &.col-1,&.col-2{margin-right: 20px;}
    &.col-3{width: 346px;}
    text-indent: 40px;
    .index-simple-proCon-tit{
      margin-top: 38px;
      font-size: 26px;color: $mainColor;
      .icon50{
        margin-right: 16px;
      }
    }
    .index-simple-proCon-text{
      margin-top: 12px;
      font-size: 16px;color: $c-6;
    }
  }
}
//首页公告
.index-notice{
  margin-top: 20px;
  &> .container{background-color: $c-f;
    height: 54px;
    line-height: 54px;
    @extend %clearfix;
  }
  .icon32{
    @extend %fl;
    margin:10px 15px 0 20px;
    &.icon-notice{
      background: url("../images/index/icon-notice.png") 0 0 no-repeat;
    }
  }
  .noticeListUlBox{
    @extend %fl;
    width: 880px;
    height: 54px;overflow: hidden;
  }
  ul.noticeListUl{
    width: 100%;
    position: relative;
    li{
      height: 54px;
      line-height: 54px;
      position: relative;
      color: $c-3;
      a{font-size: 14px;color: $c-6;
        &:hover{color: $mainColor;}
      }
      time{
        position: absolute;
        right: 0;
        top:0;
        font-size: 14px;
        color: $c-9;
      }
    }
  }
  a.pull-right{
    font-size: 14px;
    color: $c-9;
    &:hover{color: $mainColor;}
    margin-right: 30px;
  }
}
//首页理财产品
.index-product{
  a.productLink{//理财产品的链接喽
    font-size: 18px;
    color: $c-6;
    display: block;
    //line-height: 36px;
    &:hover{
      color: #8fbb40;
    }
    .icon-video{
      width: 36px;
      height: 36px;
      background:url("../images/index/icon-video.png") no-repeat;
      @extend %dis-inlineblock;
      vertical-align: middle;
      margin-right: 10px;
      margin-top: -8px;
    }
  }
  .btn{width: 160px;height: 44px;line-height: 44px;}
  .introduce{
    width: 210px;
    height: 100%;
    color: $c-f;
    position: absolute;
    top:0;left: 0;
    .introduceBox{
      position: absolute;
      width: 100%;
      top:40px;//margin-top: -34px;
      height: 60px;
      left: 0;
    }
    .introduce-text1{font-size: 28px;}
    .introduce-text2{font-size: 14px;margin-top: 3px;}
    .introduce-text3{
      margin-top: 14px;
    }
    .btn{
      border: none;
      width: 72px;
      height: 24px;line-height: 24px;
      font-size: 14px;
      border-radius: 2px;
      //margin-left: -40px;
      text-align: center;
      text-indent: 0;
    }
  }
  .productCon{//新手专享的内容喽
    @extend %fl;
    @extend %clearfix;
    margin-left: 210px;
    width: 870px;
  }
  .product-major{//新手专享
    margin-top: 20px;
    @extend %clearfix;
    background-color: $c-f;
    @extend %tc;
    border-top:1px solid #ff9933;
    position: relative;
    height: 178px;
    &.green{//灵活宝
      border-top-color: #43d7ce;
      .introduce{
        background:url("../images/index/index-product-green.png") bottom right no-repeat #43d7ce;
      }
    }
    &.greenYellow{
      border-top-color: #89d860;
      .introduce{
        background:url("../images/index/index-product-greenYellow.png") bottom right no-repeat #89d860;
      }
    }
    .introduce{
      @extend %tl;text-indent: 3rem;
      background:url("../images/index/index-product-introduce.png") bottom right no-repeat #ff9933;
      .btn{
        background-color: #f29130;
        background-color:rgba($c-0,0.05);
        &:hover{
          background-color: #e5892e;
          background-color: rgba($c-0,0.1);
        }
      }
    }
    .product-major-tit{
      font-size: 24px;
      color: $c-3;
      margin:28px 0 0  60px;
      @extend %tl;
    }
    .product-major-con{
      @extend %tl;
      margin:50px 0 0  60px;
      //margin:20px 0 0  60px;
      @extend %clearfix;
    }
    ul.product-major-conUl{
      @extend %clearfix;
      li{
        @extend %fl;
        dt,em{font-size: 14px;color: $c-9;}
        dd{font-size: 24px;color: $c-3;
          height: 47px;
          line-height: 50px;
        }
        &.li1{
          width: 200px;
          dd{font-size: 36px;color: $mainColor;
            line-height: normal;
            //em{font-size: 24px;color: inherit;}
          }
        }
        &.li2{
          width: 170px;
        }
        &.li3{
          width: 230px;
        }
        &.li4{
          width: 200px;@extend %tc;
          .btn{margin-top: 10px;}
        }
        .text-desc{
          font-size: 1rem;
          height: 40px;line-height: 40px;
          color: $c-6;
        }
      }
    }
  }
  .product-list{//爱康宝盈，爱康宝，爱康票票
    @extend %clearfix;
    color: $c-3;
    margin-top: 20px;
    @extend %tc;
    position: relative;
    height: 365px;
    background-color: $c-f;
    border-top: #57b3ff 1px solid;
    .introduce{
      @extend %tl;text-indent: 3rem;
      background: url("../images/index/index-product-listUl.png") right bottom no-repeat #57b3ff;
      .introduceBox{height: 126px;
        //margin-top: -63px;
      }
      .btn{
        background-color: #53aaf2;
        background-color:rgba($c-0,0.05);
        &:hover{
          background-color: #4ea1e5;
          background-color: rgba($c-0,0.1);
        }
      }
    }
    .product-list-tit{
      margin: 30px 0 20px 0;
      font-size: 20px;
    }

    .interest-rate{
      color: $mainColorOrange;
      font-size: 54px;
      em{font-size: 40px;}
    }
    .interest-rate-text{color: $c-9;}
    .indexProductTitBox{
      width: 800px;//background-color: red;
      margin: auto;
      height: 52px;line-height: 52px;
      overflow: hidden;
      color: $c-9;
      .con1{text-indent: 1.75rem;}
    }
    .indexProduct-con{
      @extend %fl;
      &.con1{width:22%;text-align: left;}
      &.con2{width:15%;}
      &.con3{width:15%;}
      &.con4{width:15%;}
      &.con5{width:22%;}
      &.con6{width:11%;}
      em{color: $c-6;font-size: 1rem;}
      .mainColor{
        color: $mainColor;
        &.disabled{
          color: $c-6;
          //cursor: not-allowed;
        }
      }
      .box-column{width: 64%;margin: auto;
        .column{width: 60%;height: 4px;}
        .column-text{color: $c-6;}
      }
    }
    ul.product-listUl{
      width: 820px;
      margin: auto;
      &>li{
        height: 77px;line-height: 75px;
        border-top: 1px solid #f4f4f4;
        padding: 0 10px;
        &:hover{
          background-color: $c-f6;
          a.mainColor{
            display: inline-block;
            width: 100%;
            background-color: $mainColor;
            color: $c-f;
            height: 30px;line-height: 30px;
            border-radius: 4px;
            &.disabled{
              color: $c-6;
              display: inline;
              background-color: transparent;
            }
          }
        }
        .con3{color: $mainColor;font-size: 18px;
          //em{color: inherit;}
        }
      }
    }
    /*ul.product-listUl{
      width: 100%;
      @extend %clearfix;
      & > li{
        height: 365px;
        @extend %fl;
        width:233px;
        border-right:1px solid $c-f2;
        @extend %tl;
        padding-left: 56px;
        position: relative;
        &.li1{
          .product-listUl-li1,.product-listUl-li2{display: none;}
          .product-listUl-li1{display: block;}
          &.active{
            .product-listUl-li1,.product-listUl-li2{display: none;}
            .product-listUl-li2{display: block;}
          }
        }
        &.li2{
          .product-listUl-li1,.product-listUl-li2{display: none;}
          .product-listUl-li1{display: block;}
          &.active{
            .product-listUl-li1,.product-listUl-li2{display: none;}
            .product-listUl-li2{display: block;}
          }
        }
        &.li3{
          border-right:none ;
        }
        .bgTopLine{
          height: 7px;
        }
      }
    }*/
    .product-info{
      margin-top: 20px;
      font-size: 0;
      color: $c-6;
    }
    .one-row{@extend %clearfix;height: 26px;line-height: 26px;}
    .product-info-tit,.product-info-con{@extend %dis-inlineblock;
      font-size: 14px;
    }
    .product-info-tit{@extend %tr;}
    .product-info-con{@extend %tl;}
    .product-btnBox{
      //width: 54%;
      position: absolute;
      bottom: 24px;
      left: 56px;
      margin: 30px auto 0;
    }
  }
}
//标题统一样式
.index-tit{
  margin-top: 30px;
  color: $c-3;
  position:relative ;
  height: 38px;
  h2{
    font-size: 20px;
    font-weight: normal;
  }
  a{position:absolute;top:6px;right: 0; color:$c-6;font-size: 14px;
    &:hover{color: $mainColor;}
  }
}
//index-recommend推荐app下载
.index-recommend{
  position: relative;
  height: 270px;
  margin-top: 20px;
  .container{
    background: url("../images/index/index-recommendBg.png") repeat-x;
    height: 270px;
  }
  .index-recommend-con{
    position: absolute;
    top:74px;
    left: 50%;
    margin-left: -420px;
    color: $c-f;
    dt{font-size: 28px;font-weight: bold;}
    dd{font-size: 14px;margin-top: 10px;}
    .appIssued-btnBox{
      margin-top: 10px;
      .appIssued-btn{
        @extend %dis-inlineblock;
        width: 160px;
        height: 40px;
        border: $c-f 1px solid;
        border-radius: 6px;
        background: url("../images/index/btn-icon.png") no-repeat -999px -999px;
        margin-right: 16px;
        &.btn-iphone{
          background-position: 0 0;
        }
        &.btn-android{
          margin-top: 20px;
          background-position: 0 -40px;
        }
      }
    }
  }
  .index-recommend-img{
    width: 358px;height: 237px;
    position: absolute;
    left: 50%;
    margin-left: 70px;
    bottom: 0;
    background: url("../images/index/recommend-img.png") no-repeat;
  }
}
//首页媒体报道
.index-news{
  overflow: hidden;
  .index-newsBox{@extend %clearfix;}
  ul.index-newsListUL{
    color: $c-9;
    font-size: 14px;
    //margin: 10px 0;
    background-color: $c-f;
    width: 724px;
    @extend %fl;
    padding: 28px 0;
    height: 174px;
    li{
      position: relative;
      height: 34px;
      line-height: 34px;
      margin: 0 34px;
    }
    a{font-size:inherit;}
    time{
      position: absolute;
      right: 0;
    }
  }
  .videoBox{//宣传视频
    width: 336px;
    @extend %fr;
    height: 230px;
    background-color: $c-f;
    a{display: block;height: 184px;overflow: hidden;}
    .videoBox-text{
      height: 46px;
      line-height: 46px;
      @extend %tc;
      color: $c-6;
    }
  }
}
//svg的icon
.icon-indexbig{
  @extend %icon64;
  //background-size:96%;
  transition: all 1s;
  &:hover{
    transform: rotateY(180deg);
    //  background-image: url(../images/index/simple-prointr2.svg),none;
  }
  //4个icon呢
  @for $i from 0 through 3 {
    &.icon-#{$i + 1} {
      background-position-x: 0;
      background-position-y: -$i*74px;
    }
  }
}

//合作伙伴
.index-partner{
  overflow: hidden;
  padding-bottom: 35px;
  @at-root .index-partnerBox{
    //margin: 40px 0 60px 0;
    background-color: $c-f;
    position: relative;
    height: 100px;
    overflow: hidden;
    .icon32{
      display: block;
      position: absolute;
      top:50%;
      margin-top: -16px;
      width: 32px;
      height: 32px;
      background: url("../images/index/switch.png") -999px -999px no-repeat;
      &.icon-switch-left{
        left:28px;
        background-position: 0 0;
      }
      &.icon-switch-right{
        right:28px;
        background-position: -32px 0;
      }
    }
    &.smallPartner{
      .icon32.icon-switch-left{
        left:0;
      }
      .icon32.icon-switch-right{
        right:0;
      }
      .index-partnerCon{
        width: 656px;
      }
      ul.index-partnerUL{
        li{
          width: 164px;
        }
      }
    }
  }
  @at-root .index-partnerCon{
    width: 82%;
    margin:0 auto;
    padding-top: 25px;
    height: 50px;
    overflow: hidden;
    position: relative;
  }
  @at-root ul.index-partnerUL{
    //margin-left: -50px;
    width:9999px;
    //left: -30px;top:0;
    //position: relative;
    li{@extend %fl;//display: inline;
      //margin: 0 15px;
      width: 180px;height: 50px;
      img{display: block;}
    }
  }
}
.font12{font-size: 12px;}
.font16{font-size: 16px;}
.font22{font-size: 22px ;}
//底部
footer{background-color: $c-3;color: #d0d0d0;
  @extend %clearfix;
  &.landing{
    background-color: #7b7a7a;
  }
  //&>.container{}
  .footerBox{@extend %clearfix;}
  nav{margin-top: 45px;color: lighten(#707070,20%);
    a{
      padding: 0 10px;
      color: #d0d0d0;
      &:hover{color: $c-f;text-decoration: underline;}
      &:visited{color: #d0d0d0;}
    }
  }
  .copyright{
    margin-top: 20px;
    border-top:1px solid #a2a1a1;
    padding: 20px 0 20px 0;
  }
  .pull-right{margin-top: 30px;}
  .ewm{@extend %dis-inlineblock;vertical-align: top;}
  .ewm{@extend %tc;margin: 10px 0 0 40px;}
  .footer-info{
    line-height: 2rem;
    margin-top: 10px;
    padding-left: 10px;
    span{padding: 0 20px;}
  }

  .authoritys{//底部权威的图片呢
    img{
      opacity: 0;
      filter:alpha(opacity=0);
      cursor: pointer;
    }
    &.authority-1{
      background: url("../images/footer/cert_grey.png") left center no-repeat;
      &:hover{
        background-image: url("../images/footer/cert.png");
      }
    }
    &.authority-2{
      background: url("../images/footer/getseal_grey.png") left center no-repeat;
      &:hover{
        background-image: url("../images/footer/getseal.gif");
      }
    }
    &.authority-3{
      background: url("../images/footer/hl_grey.jpg") left center no-repeat;
      &:hover{
        background-image: url("../images/footer/hl.jpg");
      }
    }
    &.authority-4{
      background: url("../images/footer/hyyz_grey.png") left center no-repeat;
      &:hover{
        background-image: url("../images/footer/hyyz.png");
      }
    }
  }
}
//登录注册
.login-reg-title{//头部
  font-size: 1.71rem;
  margin: 38px 0 20px 0;
}
.lr-icon{//icon
  @extend %icon16;
  margin-right: 5px;
  vertical-align: middle;

  &.icon-error{
    background-position: 0 -130px;
  }
  &.icon-success{
    background-position: 0 -156px;
  }
}
.login-reg-body{//主体内容
  @extend %clearfix;
  background-color: $c-f;
  padding: 50px 0 120px 0;
  margin-bottom: 20px;
  min-height: 400px;
  &.reg-suceess{//注册成功
    padding: 120px 0 240px 0;
    //margin-bottom: 20px;
  }
  .lr-body-con{
    @extend %fl;
    width: 730px;
    margin: 0 0 0 40px;
  }
  .lr-body-item{margin-top: 16px;}
  .lr-body-item2{
    margin-top: 10px;
    //@extend %tr;
    .lr-body-conBox{@extend %tr;}
    .forget-pw-safe{color: $c-6;
      //position: absolute;
      //right:0;height: 20px;
      &:hover{color: $mainColor;}
    }
  }
  .lr-body-item3{margin-top: 34px;}
  .lr-body-conBox{
    position: relative;
    width: 284px;
    &.lr-agreement{//我已经阅读并同意协议
      color: $c-6;
    }
    .lr-text{//这是input
      width: 252px;
      height: 20px;
      line-height: 20px;
      font-size: 1rem;
      padding: 8px 15px 8px 10px;
      border: 1px solid $c-db;
      border-radius: 5px;
      overflow: hidden;
      &:focus{
        outline:none ;
        border: $mainColor 1px solid;
      }
      &.lr-text-half{
        width: 134px;
      }
    }
    .label-state{//错误或正确提示
      color: $mainColor;
      line-height: 36px;
      height: 36px;
      position: absolute;
      top: 0px;
      right: -374px;
      width: 360px;
      padding: 0 5px;
    }
    @at-root .yzm{//验证码
      width: 106px;
      height: 39px;
      display: block;
      position: absolute;
      top:0;
      right:4px;

    }
    .btn.btn-yzm{//获取手机验证码按钮
      width: 106px;height: 35px;
      line-height: 35px;
      background-color: transparent;
      border: $mainColor 1px solid;
      color: $mainColor;
      padding: 0;
      font-size: 1rem;
      position: absolute;
      top:0;
      right:4px;
      &:hover{ transition-duration:0s;
        background-color: $mainColor;
        color: $c-f;
      }
    }
    @at-root .password-eye{//显示或隐藏密码输入
      @extend %icon16;
      display: block;
      position: absolute;
      top:10px;right: 16px;
      cursor: pointer;
      background-position:0 -78px !important;
      &.password-eye-close{background-position:0 -52px  !important; }
    }
  }

  .lr-body-aside{@extend %fl;
    .lr-body-asideitem{margin:16px 0 50px 0;}
  }

}
.suceess-box{//注册成功
  @extend %tc;
  margin: auto;
  .icon64-relevant{
    @extend %icon64;
    &.icon64-suceess{
      display: block;
      margin: auto;
      background-position: 0 -370px;
    }
  }
  .icon64-loading{
    width: 54px;height: 54px;
    display: block;
    background: url("../images/loading2.gif") no-repeat;
    margin:40px auto;
  }
  .describe-icon{//图标下的描述文字
    color: #8ebd57;
    font-size: 16px;
    margin: 20px 0 40px 0;
    .grey{
      color: $c-9;
      margin-bottom: -10px;
    }
  }
  .btn{width: 166px;}
}
//灵活宝详情页
.greenNote{
  .note-header{
    background: url("../images/product/greenTopBg.png") repeat-x bottom left #61D6CD;
    margin-top: 0;
    dl.note-hDL{
      border-color:#6BDAD2 ;
      height: 110px;
      &.dl1{
        padding-right: 50px;
        dd{color: $c-f;line-height: 70px;}
      }
      &.dl2{padding:0 50px;}
      dt,dd{color: $c-f;}
      dt{height: 30px;}
      dd{height: 60px;line-height: 80px;}
    }
  }
  .greenNote-topLeft{
    width: 640px;
    @extend %fl;
    .note-h-title{
      color: $c-f;
      border: none;line-height: 70px;
      text-indent: 0;
    }
  }
  .greenNote-topLeft-con{
    overflow: hidden;
    background-color: #4BCEC3;
    .greenNote-topLeft-dlBox{
      margin: 22px 0 0 28px;
    }
    .box-column{
      //height: 10px;
      .column-text{
        display: block;@extend %tr;color: $c-f;
        height: 22px;line-height: 22px;
        font-size: 16px;padding-right: 12px;
      }
      .column{
        height: 10px;
        width: 100%;
        background-color: #82E2DB;
        border-radius: 0;
      }
    }
  }
  .greenNote-topRight{
    @extend %fr;
    background-color: $c-f;
    padding: 30px;
    margin-top: 25px;
  }
  a.mainColor{color: $mainColor;}
  .note-body{
    ul.note-body-titUL{
      @extend %row3tabTit;
    }
  }
  .histogramBox{
    width: 994px;
    height: 290px;
    padding:30px 20px 0 0;
    background-color: #F4F6F9;
    margin-top: 20px;
    overflow: hidden;
    font-size: 14px;
    color: $c-9;
    .histogram-left{
      @extend %fl;
      width: 56px;
      text-align: right;
      .histogram-text{
        height: 51px;line-height: 51px;
      }
    }
    .histogram-bottom{
      margin: 0 25px 0 66px;
      overflow: hidden;
      height: 30px;line-height: 30px;
      @extend %tc;
      .histogram-text{
        @extend %fl;width: 7.69%;
        white-space: nowrap;
      }
    }
    .histogram-con{
      margin: 25px 25px 0 66px;
      position: relative;
    }
    .histogram-textBox{
      position: absolute;
      width: 100%;left: 0;top:0;
      height: 100%;
    }
    .histogram-moneyText{
      position: absolute;
      width: 100%;
      left: 0;bottom: 0;
      height: 68px;line-height: 68px;
      color: $c-f;text-align: center;
      font-size: 18px;
      pointer-events:none;
    }
    .tree-diagram{
      width: 70px;
      height: 100%;
      position: relative;
      float: left;
      &:hover{
        .tree-diagram-color{
          background-color: #FFC119;
        }
      }
      //border-right:1px solid #e0e0e0;
    }
    .tree-diagram-num{
      width: 100%;
      height: 25px;
      bottom: 50px;
      position: absolute;
      text-align: center;
      font-weight: bold;
      color: #F7A91A;
    }
    .tree-diagram-color{
      width: 100%;
      background-color: #F9E4BE;
      height: 50px;
      position: absolute;
      bottom: 0;
      left: 0;
    }
    table.histogramTable{
      width: 910px;
      td{width:70px;
        height: 50px;
        border: 1px solid #e0e0e0;
        //border-bottom: 1px solid #e0e0e0;
      }
    }
  }
}
//新手专享详情页
.noviceGreenNote{
  .note-header{
    height: 400px;
    dl.note-hDL{
      height: 100px;
      &.dl1{
        padding-right: 60px;
      }
      &.dl2{padding:0 60px;}
      dt{color: $c-9;height: 30px;}

    }
    .note-h-conl{margin-left: 38px;}
    .note-boxcolumen{margin-top: 30px;}
  }
  .note-body{
    ul.note-body-titUL{
      @extend %row3tabTit;
    }
  }
}
.iconAdvantageCon{
  overflow: hidden;
  margin-top: 30px;
  font-size: 1rem;
  color:$c-6;
  .iconLvXinBaoBox{@extend %fl;
    @extend %tc;
    &.iconBox-1{margin-left: 20px;}
    &.iconBox-2,&.iconBox-3,&.iconBox-4{margin-left: 80px;}
    &.iconBox-5,&.iconBox-6,&.iconBox-7{
      color: $c-f;width: 160px;
      border-right:1px solid #84E0DA;
    }
    &.iconBox-7{border: none;}
  }
  .icon-iconLvXinBao{display: inline-block;}
  @for $i from 0 through 6{
    .icon-#{$i+1}{
      background-position-x: 0 ;
      background-position-y: -$i * 54px;
    }
  }
  /*.icon-1{background-position: 0 0*54px;}
  .icon-2{background-position: 0 -1*54px;}
  .icon-3{background-position: 0 -2*54px;}
  .icon-4{background-position: 0 -3*54px;}*/
}
@keyframes zhuanzhuan {
  0%{
    transform: rotate(0deg);
  }
  100%{
    transform: rotate(-360deg);
  }
}
.icon-iconLvXinBao{
  display: block;
  width: 54px;height: 54px;
  background: url("../images/icon/iconLvXinBao.png") -9999px -9999px no-repeat;
  &.icon-coupon{
    display: inline-block;
    width: 30px;height: 21px;
    background-position: -12px -395px;
    vertical-align: middle;
    margin-right: 10px;
  }
  &.icon-reload{
    display: inline-block;
    width: 18px;height: 16px;
    background-position: 0 -448px;
    //vertical-align: middle;
    margin-left:4px;
    cursor: pointer;
    &.active{
      opacity: 0.6;
      animation: zhuanzhuan ease 0.8s infinite;
    }
  }
}

//金融资产详情页
.financeNote{
  .box-column .column span{
    background-color: #68d3cb;
  }
  .note-body{
    ul.note-body-titUL{
      @extend %row4tabTit;
    }
  }
}

//票据详情页
.note{
  .note-header{}
  .note-body{min-height: 460px;}
  /*
  @at-root table.leftRightTable{
    font-size: 14px;
    th,td{border-bottom: $c-ea 1px solid;
      padding:20px;
    }
    th{width: 15%;background-color: $c-f8;color: $c-9;
      font-weight: 200;
    }
    td{width: 85%;
      color: $c-3;

    }
  }
  */
}
.note-header,.note-body{background-color: $c-f;}
.note-header{
  height: 420px;
  margin: 20px 0 20px 0;
  .note-h-r-protocol{
    color: $c-6;
    padding: 4px 0 10px;
  }
  //&:hover{@extend %hover-bgshadow;}
  .note-h-title{height: 58px;line-height: 58px;font-size: 1.29rem;
    border-bottom: #f1f1f1 1px solid;
    text-indent: 20px;
    span{color: $c-6;font-size: 1rem;padding-left: 26px;}
  }
    .notetit-level{
      color: $c-6;font-size: 1rem;
      .icon-info{
        margin-left: 6px;
      }
      .tooltip {
        bottom: auto;
        top: 100%;
        margin-top: 12px;
        width: 280px;
        z-index: 3;
        margin-left: -290px;
        &:after,&:before{
          left: 92%;
          margin-left: -9px;
          border-style: solid;
          border-width: 0 8px 10px;
          border-color: transparent;
        }
        &:after{
          //background-color: red;
          bottom:auto;
          top:-9px;
          border-top-color: transparent;
          border-bottom-color: $c-f;
        }
        &:before{
          bottom:auto;
          top:-10px;
          border-top-color: transparent;
          border-bottom-color: $c-db;
        }
      }
    }
  .note-h-con{@extend %clearfix;}
  .note-h-conl{
    width: 666px;@extend %fl;
    margin-left: 26px;
  }
  .note-h-conls{margin-top: 38px;}
  dl.note-hDL{height: 140px;border-right:$c-f1 1px solid ;
    @extend %dis-inlineblock;vertical-align: top;
    &.dl1{
      padding-right: 24px;
      dd{font-size: 3rem;color: $mainColor;
        line-height: 90px;
        font-weight: lighter;
      }
      em{font-size: 2.14rem;}
      span.emSpan{font-size: 14px;color: $c-9;padding:0 0 0 3px;}
    }
    &.dl2{padding:0 40px;}
    &.dl3{padding:0 40px;}
    &.dl4{border-right: none;padding-left: 30px;}
    dd{font-size: 1.71rem;height: 70px;line-height: 100px;
      color: $c-6;
      em{font-size: 1.29rem;}
    }
    dt{height:70px;font-size: 1rem;color: $c-6;
      margin-top: 8px;
    }
  }
  .note-h-des{
    width: 100%;margin-top: 45px;
    @extend %clearfix;
    height: 40px;line-height: 40px;
    //background-color: $c-f8;
    color: $c-6;
  }
  dl.note-h-desDL{@extend %fl;
    font-size: 13px;
    dt,dd{@extend %dis-inlineblock;}
    dt{}
    dd{margin-right: 16px;}
    .icon-info{
      margin-left: 8px;z-index: 1;
      .tooltip{text-align: left;}
    }
  }
  .note-boxcolumen{
    width: 618px;
    margin-top:16px;
    .box-column .column{width: 82%;}
    .column-tit{width: 70px;}
    .column-tit,.column-text{font-size: 13px;}
  }
  .note-finish{
    @extend %fr;width: 200px;
    position: relative;
    .icon-note-finish{
      top:-146px;left: 86px;
    }
  }
  //右侧
  .note-h-conr{
    width: 326px;//height: 230px;
    margin: 40px 30px 0 0;
    border-left:$c-f1 1px solid ;
    position: relative;
    //background-color: #ccc;
    .NoteTopPosition{
      position: absolute;
      right:0;bottom:-23px;
      font-size: 0.75rem;
      color: $c-6;
      width: 290px;
      text-align: center;
    }
  }
  //右侧内容
  .note-h-conrbody{@extend %clearfix;
    width: 290px;
    @extend %fr;
    .note-appEwmBox{//app专享标的信息
      margin-left: 40px;
      border: $mainColor 1px solid;
      width: 180px;
      height: 204px;@extend %tc;
      padding: 10px;
      position: relative;
      img{width: 100%;display: block;}
      .note-appText{font-size: 14px;color: $mainColor;
        position: absolute;
        bottom: 10px;
        left: 0;right: 0;
      }
    }
    .note-h-rTop{
      //margin-top: 6px;
      color: $c-6;
      strong{font-size: 1.29rem;}
    }
    .note-h-r1{
      margin-top: 10px;
      color: $c-6;position: relative;
      @extend %clearfix;
      .bankCustodyIconInfo{
        .tooltip{
          bottom:auto;
          top:100%;
          margin-top:12px;
          width: 280px;
          z-index: 3;
          margin-left: -150px;
          &:after,&:before{
            left: 50%;
            margin-left: -9px;
            border-style: solid;
            border-width: 0 8px 10px;
            border-color: transparent;
          }
          &:after{
            //background-color: red;
            bottom:auto;
            top:-9px;
            border-top-color: transparent;
            border-bottom-color: $c-f;
          }
          &:before{
            bottom:auto;
            top:-10px;
            border-top-color: transparent;
            border-bottom-color: $c-db;
          }
          .bankCustodyIconInfo-money{
            line-height: 24px;
          }
          .bankCustodyIconInfo-desc{
            margin-top: 8px;
            text-align: justify;
            background-color: $c-f5;
            color:$c-6;
            font-size: 14px;padding: 10px;
            text-indent: 2em;
          }
        }
      }
      &.active{
        .note-hr-state{
          &.note-login{display: none;}
          &.note-loggedin{display: block;}
        }
      }
      strong{font-size: 1.29rem;}
      a{display: block;@extend %tc;
        position: absolute;
        top:-2px;right: 0;
        //width: 50px;
        height: 25px;
        line-height: 25px;
        //border: $mainColor 1px solid;
        //border-radius: 5px;
        color: $mainColor;
        &:hover{
          //background-color: $mainColor;
          //color: $c-f;
        }
      }
      .note-hr-state{display: none;
        &.note-login{display: block;}
      }
    }
    .note-h-r2{position: relative;margin-top: 25px;
      .note-h-money{border:$c-db 1px solid;
        height: 38px;line-height: 38px;
        width: 273px;
        border-radius: 5px;
        padding-left: 15px;
        //text-indent: 1em;
      }
      span{color: $c-9;}
    }
    .note-h-r3{
      color: $c-9;margin-top: 8px;
      strong{color: $mainColor;font-size: 1.29rem;padding:0 5px 0 2px;}
      height: 24px;
      line-height: 24px;
      &.error{
        .note-h-r3Con{display: none;}
        .note-h-r3Error{display: block;
          color: $mainColor;
        }
      }
      .note-h-r3Con{display: block;}
      .note-h-r3Error{display: none;}

    }
    .note-h-r4{
      margin-top: 0;//abc   36px
      .btn{width: 100%;}
    }
    .note-h-r5{
      @extend %tc;
      color: $c-9;
      font-size: 1rem;
      margin-top: 14px;
      &.active{color: $mainColor;}
    }
    /*
    .note-h-rAgreement{
      margin-top: 18px;
      font-size: 14px;
      line-height: 22px;
      color: $c-6;
      //padding-left: 10px;
      a{color: $mainColor;}
      .notehr-label-agreement{
      }
      input{width: 14px;height: 14px;
        margin:2px 0 0 0px;
      }
    }
    */
  }
}
%rowNtabTit{//N等分选项卡标题（UL）
  @extend %tc;@extend %clearfix;
  height: 55px;
  li{
    height: 52px;line-height: 52px;border-top:$c-f8 3px solid;
    color: $c-6;font-size: 1.29rem;background-color:$c-f8 ;
    @extend %fl;
    cursor: pointer;
    &.active{border-top-color: $mainColor;background-color:$c-f;}

  }
}
%row3tabTit{//三等分选项卡标题（UL）
  @extend %rowNtabTit;
  li{width: 33.33%;}
}
%row4tabTit{//四等分选项卡标题（UL）
  @extend %rowNtabTit;
  li{width: 25%;*width:24.97%;}
}
%row5tabTit{//四等分选项卡标题（UL）
  @extend %rowNtabTit;
  li{width: 20%;}
}
.note-body{
  .note-subtitle{
    height: 32px;line-height: 32px;
    background-color: #f2f2f2;
    text-indent: 20px;
  }
  .borrower-noLog{
    text-align: center;
    height: 140px;line-height: 140px;
    .mainColorA{
      color: $mainColor;
      padding: 0 5px;
      text-decoration: underline;
      &:hover{
        text-decoration: underline;
      }
      &:active,&:visited{
        color:$mainColor;
      }
    }
  }
  //&:hover{@extend %hover-bgshadow;}
  .note-appBannerBox{//app专享活动banner
    margin: 10px auto 30px;@extend %tc;
    img{width: 100%;display: block;}
  }
  ul.note-body-titUL{
    //@extend %row5tabTit;
    @extend %tc;@extend %clearfix;
    height: 55px;
    display: table;
    width: 100%;
    li{
      display: table-cell;
      height: 52px;line-height: 52px;border-top:$c-f8 3px solid;
      color: $c-6;font-size: 1.29rem;background-color:$c-f8 ;
      //@extend %fl;
      cursor: pointer;
      &.active{border-top-color: $mainColor;background-color:$c-f;}

    }
  }
  .item{display: none;@extend %clearfix;margin-bottom: 20px;
    &.active{display: block;}
    .item-body{margin: 36px 36px 20px;
      line-height: 26px;
    }
  }
  //产品信息
  dl.note-product-infoDl{
    span.lineK{
      width: 3px;
      height: 20px;
      background-color: $mainColor;
      display: inline-block;
      vertical-align: middle;
      margin-right: 17px;
    }
    &>dt{
      padding-top: 30px;
      font-size: 18px;color: $c-3; border-bottom:1px solid $c-db;
      padding-bottom: 14px;

    }
    &>dd{font-size: 14px;color: $c-6;line-height: 24px;
      padding: 20px 20px 26px 20px;
      table.defaultTable{
        color: $c-3;
        .blue{color: $mainColor;}
        td{height: 46px;line-height: 46px;}

      }
      p{
        margin:0 0 30px 0;
      }
    }
    .mainColor{cursor: pointer;}
  }
  .note-productCharacteristic{//产品信息中的产品特点
    @extend %clearfix;@extend %tc;
    .icon100{
      display: block;
      width: 100px;
      height: 100px;
      background:url("../images/product/icon100.png") -999px -999px no-repeat;
      margin:16px auto 18px;
      &.icon-profit{
        background-position: 0 0;
      }
      &.icon-security{
        background-position: 0 -200px;
      }
      &.icon-check{
        background-position: 0 -300px;
      }
      &.icon-risk{
        background-position: 0 -100px;
      }
    }
    dl{
      dt{font-size: 18px;color: $c-3;padding-bottom: 10px;}
      dd{padding-bottom: 16px;}
    }
  }
  //风控措施
  .risk-measures{
    margin-top: 0;
    overflow: hidden;
    @extend %tl;position: relative;
  }
  .risk-measures-icon{//图标
    @extend %dis-inlineblock;
    background: url("../images/product/note2BodyFooterIcon.png") no-repeat -9999px -9999px;
    &.icon-1,&.icon-2,&.icon-3,&.icon-4{
      width: 72px;height: 72px;vertical-align: middle;
      margin-right: 18px;
    }
    &.icon-1{background-position:0 0;}
    &.icon-2{background-position:0 -72px;}
    &.icon-3{background-position:0 -144px;}
    &.icon-4{background-position:0 -216px;}
    &.icon-arrowRigth,&.icon-arrowBottom,&.icon-arrowLeft{
      width: 34px;height: 34px;position: absolute;
    }
    &.icon-arrowRigth{top:120px;left: 50%;margin: 0 0 0 -24px;
      background-position:0 -288px ;
    }
    &.icon-arrowBottom{top:270px;left: 70%;
      background-position:0 -322px ;
    }
    &.icon-arrowLeft{top:410px;left: 50%;margin: 0 0 0 -28px;
      background-position:0 -356px ;
    }
  }
  ul.risk-measuresUl{
    margin:-20px 0 0 20px;
    &>li{
      border: 1px solid $c-db;
      width: 340px;height: 170px;
      padding: 30px;
      @extend %fl;
      margin: 50px 35px 0;
    }
  }
  .risk-measures-titBox{
    font-size: 24px;color: $c-3;
  }
  .risk-measures-conBox{
    margin-top: 20px;
  }
  //借款信息
  .note-borrowerInfoUl{
    @extend %clearfix;
    padding-bottom: 12px;
    margin-top: -10px;
    li{
      width: 33%;
      @extend %fl;height:22px;line-height: 22px;
      position: relative;
      //overflow: hidden;
      margin: 15px 0 0 0;
      cite{color: $c-6;
        position: absolute;
        top:0;left: 0;
        width: 100px;
      }
      span.citeR{
        color: $c-3;
        float: left;
        margin-left: 100px;

      }
    }
  }
  //产品介绍图片点击切换
  .note-promo{
    margin-top: 40px;
    .promo{
      height: 250px;
      width: 400px;
      //overflow: hidden;
      //position: relative;
      @extend %tc;
      margin: 0 auto;
      img{
        cursor: pointer;
        height: 250px;
        width: auto;
        max-width: 400px;
        margin: 0 auto;
        display: block;
      }
      .flex-direction-nav a{background: url("../images/arr2.png") no-repeat;
        overflow: auto;
      }
      .flex-direction-nav .flex-prev{left: -60px;opacity: .8;filter:alpha(opacity=80);}
      .flex-direction-nav .flex-prev:hover,.flex-direction-nav .flex-next{opacity: 1;filter:alpha(opacity=100);}
      .flex-direction-nav .flex-next{right:-60px;background-position: -37px 0;opacity: .8;filter:alpha(opacity=80);}
      .flexslider:hover .flex-prev { opacity: 1;filter:alpha(opacity=100); left: -60px;}
      .flexslider:hover .flex-next { opacity: 1;filter:alpha(opacity=100); right: -60px;}
    }
  }
  //常见问题
  @at-root dl.commonProblemdl{
    font-size: 1rem;
    dt{color: $c-9;}
    dd{
      color: $c-3;
      margin: 10px 0 25px 0;
    }
  }
  //
}
//产品列表页
.note-list{
  margin-top: 20px;
  margin-bottom: 20px;
  //列表就这么开始了
  .index-tit{border-bottom: none;height: 40px;
    h2{font-size: 1.29rem;}
  }
  .note-listTit{
    @extend %clearfix;
    a{@extend %fl;font-size: 1.285rem;height: 55px;line-height: 55px;margin-right: 60px;
      cursor: pointer;
      &:hover{color: $mainColorOrange;}
      &.active{position: relative;
        color: $mainColorOrange;
        /*&:before{
          height: 1px;width: 100%;
          background-color: $mainColorOrange;
          content: '';
          display: block;
          position: absolute;
          top: 50%;margin-top: 14px;
          left: 0;
        }*/
      }
    }
  }
  ul.note-listUL{//@extend %clearfix;
    li{height: 140px;@extend %clearfix;
      margin-bottom: 20px;background-color: $c-f;
      position: relative;
      z-index: 1;
      .activity-welfare-label{
        position: absolute;
        top:0;right: 45px;
        display: block;
        //adding-top:3px;
        height: 22px;
        line-height: 28px;
        width: 76px;
        //height: 20px;
        @extend %tc;
        background-color: #ff8a2c;
        font-size: 14px;
        color: $c-f;
        &:after{
          position: absolute;
          top:22px;left: 0;
          content: '';
          display: block;
          clear: both;
          triangle: pointing-down;
          width: 76px;
          height: 12px;
          background-color: #ff8a2c;
        }
      }
      //border-bottom:$c-f1 1px solid;
      //&:hover{@extend %hover-bgshadow;}
      .btn{@extend %fr;}
    }
  }
  .note-list-title{
    font-size: 1.29rem;
    text-indent: 20px;
    padding-top: 20px;
    span{color: $c-9;font-size: 1rem;padding-left: 16px;}
    @at-root cite.activity-tag{//新手专享的标签哦
      @extend %dis-inlineblock;
      vertical-align: middle;
      color: $c-eggHuang;
      border: 1px solid #ff8a2c;
      text-indent: 0;
      @extend %tc;
      font-size: 14px;
      padding: 0 4px;
      height: 20px;
      line-height: 20px;
      margin-left:16px;
    }
    @at-root cite.note-countdown{//倒计时的标签哦
      @extend %dis-inlineblock;
      vertical-align: middle;
      color: $c-9;
      font-size: 1rem;
      text-indent: 26px;
      margin: 0 0 0 16px;
      height: 20px;
      line-height: 20px;
      background: url("../images/product/icon-countdown.png") no-repeat;
    }
    @at-root .note-countdown{//首页倒计间效果
      color: $c-9;
      margin: -26px 0 12px 0;
    }
  }
  .note-list-box{margin: 10px 20px 0;@extend %clearfix;}
  dl.note-list-cDL{@extend %fl;
    &.dl1{width: 260px;
      dd{color: $mainColor;font-size: 2.57rem;
        line-height: 50px;
        em{font-size: 1.71rem;
          color: $mainColor;
          span.emSpan{
            font-size: 14px;
            color: $c-9;
          }
        }
      }
      @at-root .icon-info{//活动或者其它信息提示喽
        @extend %dis-inlineblock;
        width: 16px;
        height: 16px;
        vertical-align: middle;
        background: url("../images/icon/icon-info.png") no-repeat;
        position: relative;
        &:hover{
          background-position: 0 -26px;
        }
        .tooltip{
          position: absolute;
          display: block;
          bottom:100%;left: 50%;
          margin-bottom: 12px;
          margin-left: -100px;
          font-size: 14px;
          font-weight: normal;
          line-height: 20px;
          color: $c-0;
          width: 180px;
          padding: 10px;
          //height: 70px;
          @extend %tl;
          background-color: $c-f;
          border: $c-db 1px solid;
          &:after,&:before{
            position: absolute;
            content: '';
            display: block;
            clear: both;
            left: 50%;
            margin-left: -9px;
            border-style: solid;
            border-width: 10px 8px 0;
            border-color: transparent;
          }
          &:after{
            //background-color: red;
            bottom:-9px;
            border-top-color: $c-f;
          }
          &:before{
            bottom:-10px;
            border-top-color: $c-db;
          }
        }
      }
      @at-root .activity-welfare{//爱康福利
        color: $mainColor;
        border: $mainColor 1px solid;
        @extend %dis-inlineblock;
        vertical-align: middle;
        margin-right: 6px;
        @extend %tc;
        &.activity-welfareNote,&.activity-welfareList{//列表页和详情页
          margin-top: -3px;
          margin-left: 5px;
          font-size: 16px;
          height: 22px;
          line-height: 22px;
          width: 70px;
          border-radius: 22px;
          position: relative;
          //z-index: 2;
        }
        &.activity-welfareIndexList{//首页
          //border-radius: 18px;
          border: 0;
          font-size: 14px;
          font-weight: bold;
          vertical-align: middle;
          //padding: 1px 4px;
        }
      }
    }
    &.dl2{width: 140px;}
    &.dl3{width: 260px;border-right: $c-f1 1px solid;}
    &.dl4{width: 170px;margin-left: 30px;
      dt{color: $c-3;}
      dd{line-height: 38px;}
    }
    dt{color: $c-9;}
    dd{font-size: 1.71rem;color: $c-3;height: 50px;line-height: 57px;}
    em{color: $c-9;font-size: 1rem;}
  }
  //募集资金结束罗
  .note-finish{
    @extend %fl;
    width: 160px;margin-left: 40px;
    position: relative;
    @at-root .icon-note-finish{
      position: absolute;
      width: 98px;
      height: 98px;
      top:-62px;left: 0;
      background: url("../images/product/note-list-end.png") no-repeat;
    }
  }
}
//分页盒子
.page-box{height: 80px;background-color: $c-f;
  @extend %tc;line-height: 88px;
}
//分页
.pager{font-size: 0;
  .page{
    margin: 0 4px;
    font-size: 14px;
    text-align: center;
    border: 1px solid $c-f5;
    color: $c-6;
    text-decoration: none;
    width: 32px;
    height: 32px;
    line-height: 32px;
    @extend %dis-inlineblock;
    //font-family: arial;
    background-color: #fff;
    &:hover{
      border-color: $mainColor;
    }
    &.disabled{
      color: $c-6;
      border-color:$mainColor;
      cursor: not-allowed;
    }
    &.pagebutton{
      width: 90px;
      &.disabled{
        background-color: $c-db;color: $c-f;
        border-color: $c-db;
        cursor: not-allowed;
        &:hover{
          border-color: $c-db;
        }
      }
    }
  }
}
//个人中心
.icon16-home,.icon32-home,.icon16,.icon-indexbig,.icon32,.icon20{
  //@extend %dis-inlineblock;
  vertical-align: middle;
  margin-right: 6px;
}
%icon20{
  width: 20px;
  height: 20px;
  @extend %dis-inlineblock;
  background-image: url(../images/icon/icon20.png);
  //background-image: url(../images/icon/icon20.svg),none;
  background-repeat: no-repeat;
  background-position:-9999px -9999px;
}
%icon64{
  width: 64px;
  height: 64px;
  @extend %dis-inlineblock;
  background-image: url(../images/icon/icon64.png);
  background-image: url(../images/icon/icon64.svg),none;
  background-repeat: no-repeat;
  background-position:-9999px -9999px;
}
%icon32{
  width: 32px;
  height: 32px;
  @extend %dis-inlineblock;
  background-image: url(../images/icon/icon32.png);
  background-image: url(../images/icon/icon32.svg),none;
  background-repeat: no-repeat;
  background-position:-9999px -9999px;
}
%icon16{
  width: 16px;
  height: 16px;
  @extend %dis-inlineblock;
  background-image: url(../images/icon/icon16.png);
  background-image: url(../images/icon/icon16.svg),none;
  background-repeat: no-repeat;
  background-position:-9999px -9999px;
}
.icon20{
  @extend %icon20;
  &.icon-phone{
    background-position: 0 0;
  }
  &.icon-picyz{
    background-position: 0 -20px;
  }
  &.icon-message{
    background-position: 0 -40px;
  }
}
.icon16-home,.icon16{
  @extend %icon16;
}
.icon16{
  //@extend %dis-inlineblock;
  &.icon-colse{
    //cursor: pointer;
    background-position: 0 0;
    transition: 0.5s;
    &:hover{
      transform:rotate(180deg);
    }
  }
}
.icon16-home{
  &.icon-1{background-position: 0 -104px;}
  &.icon-2{background-position: 0 -182px;}
  &.icon-3{background-position: 0 -26px;}
  &.icon-pencil{background-position: 0 -260px;}
}
.icon32{
  @extend %icon32;
  &.icon-colse{
    background-position: 0 -168px;
    cursor: pointer;
    transition: 0.5s;
    &:hover{
      rotate:(360deg);
      background-position: -42px -168px;
    }
  }
  &.icon-weixin{
    background-position: -0px -336px;
  }
  &.icon-weibo{
    background-position: -42px -336px;
  }
  &.icon-qq{
    background-position: -0px -378px;
  }
  &.icon-data-1{
    background-position: -42px -420px;
  }
  &.icon-data-2{
    background-position: -0px -462px;
  }
  &.icon-data-3{
    background-position: -42px -462px;
  }
  &.icon-data-4{
    background-position: -0px -504px;
  }
}
.icon32-home{
  @extend %icon32;
  @for $i from 0 through 2{//3个icon
    &.icon-#{$i+1}{
      background-position-x: 0;
      background-position-y: -$i*42px;
      &.active{
        background-position-x: -42px;
        background-position-y: -$i*42px;
      }
    }
  }
  &.icon-addBankCard{
    background-position: 0 -126px;
  }
}
.fullScreen{
  margin: 20px 0;
  .home-tit{
    margin: 0 44px;
    text-indent: 0;
  }
}
//免密
.noPasswordPopBody{
  text-align: left;
  width: 406px;
  margin: auto;
  .noPassword-row{
    height: 60px;
    border-bottom: 1px solid $c-db;
    position: relative;
    .icon20{
      position: absolute;
      top:24px;left: 0;
    }
    input{
      width: 200px;
      margin-top: 22px;
      height: 20px;line-height: 20px;
      font-size: 14px;
      text-indent: 40px;
      border: none;
      outline: none;
    }
    .noPasswordRight{
      position: absolute;
      right: 0;
      top:16px;
      height: 32px;line-height: 32px;
      cursor: pointer;
    }
    .error{
      position: absolute;
      bottom: -4px;
      left: 40px;
    }
  }
  .picYzm{
    width: 100px;
    height: 32px;
  }
}
//个人中心
.home{margin: 20px 0 20px 0;
  &>.container{@extend %clearfix;
    background: url("../images/home/left_bg.jpg") repeat-y 0 0 ;
  }
  nav{//个人中心左侧菜单
    @extend %fl;
    width: 165px;
    background-color: $c-f;
    .icon-home{margin-left: 16px;}
  }
  dl.nav-home{//左侧菜单
    padding-bottom: 14px;
    dt{height: 44px;line-height: 44px;font-size: 1rem;
      background-color: $c-f8;
      color: $c-9;
      text-indent: 1em;
    }
    dd{
      //height: 48px;
      line-height: 48px;
      font-size: 1.14rem;
      color: $c-6;
      text-indent: 2.3em;
      position: relative;
      &.active{
        a{color: $mainColor;}
        color: $mainColor;
        &:after{
          position: absolute;
          content: '';
          display: block;
          width: 3px;
          height: 20px;
          background-color: $mainColorOrange;
          left: 0;
          top:14px;//margin-top: -10px;
        }
      }
      &.nav-homeToggle{
        cursor: pointer;
        .icon-arrow{
          width: 16px;height: 16px;
          display: inline-block;vertical-align: middle;
          background: url("../images/icon/iconArrow.png") 0 -16px no-repeat;
        }
        &.activeToogle{
          .icon-arrow{
            background-position: 0 0;
          }
          .nav-homeToggle-con{display: block;}
        }
        .nav-homeToggle-con{
          display: none;
          height: 80px;
          text-indent: 4.3em;
          a{
            color: $c-3;
          }
          .nav-homeToggle-con-row{
            height: 40px;line-height: 40px;
            color: $c-6;
            text-indent: 0;
            text-align: center;
            cursor: default;
            a{color: inherit;}
            &.active{
              a{
                color: $mainColor;
              }
            }
          }
        }
      }
      a{color: $c-6;
        &:hover{color: $mainColor;}
      }
    }
  }
  //个人中心右侧主题部分
  .home-body{
    margin-left: 185px;
    //min-height: 700px;
    .icon-info .tooltip{
      white-space: nowrap;
      width: 300px;
      margin-left: -160px;
    }
  }
}
//个人中心右侧初始化样式
%home-rightBody{
  background-color: $c-f;
  padding-bottom: 20px;
  //min-height: 510px;
}
@keyframes showOpen {
  0%{height: 0;}
  100%{
    height: 100px;
  }
}
.btn-whiteLineText{
  display: inline-block;
  color:$c-f;
  border: 1px solid $c-f;
  height: 32px;line-height: 32px;
  padding:0 12px;
  border-radius: 4px;
  cursor: pointer;
  &:active,&:visited{
    color:$c-f;
  }
}
//消息提示
.arrowIcon{
  width: 20px;
  height: 20px;
  background-image: url(../images/icon/arrow.png);
  display: inline-block;
  vertical-align: middle;
  margin-left: 4px;
}
.reminde{
  //display: none;
  height: 50px;line-height: 50px;
  background-color: #fea628;
  color:$c-f;
  font-size: 16px;
  text-align: center;
  //overflow:hidden;
  .btn-whiteLineText{
    margin-left:20px;
    font-size: inherit;
  }

}
.home-reminde{
  //个人中心消息提示
  background-color: #fea628;
  color:$c-f;
  font-size: 16px;
  text-align: center;
  height: 50px;
  line-height: 50px;
  overflow: hidden;
  //animation: showOpen 0.6s ;
  background-color: transparent;
  margin-bottom:10px;
  &.reminde-1{
    height: 50px;
    background-color: #fea628;
  }
  &.reminde-2{
    height: 50px;
    color:$mainColor;
    background-color: #fef6e7;
  }
}
.padding-right30{
  padding-right: 30px;
}
//个人中心右侧 账户总览
.home-overview{
  .user-info{
    height: 200px;
    background-color: $c-f;
  }
  .my-recommend{//我的推荐码
    height: 106px;
    line-height: 106px;
    background:url("../images/home/my-recommendBg.png") center right no-repeat $c-f;
    margin-top:20px ;
    .my-recommendCode{
      @extend %fl;
      color: $c-3;
      font-size: 16px;
      text-indent: 26px;
      .red{font-size: 18px;}
    }
    .my-recommendCodeBtn{
      @extend %fl;margin-left: 26px;
      width: 110px;
      //background-color: yellow;
      .btn{width: 100px;}
    }
    .my-recommendCodeShare-tit{
      @extend %fl;
      margin-left: 100px;
    }
    .my-recommendCodeShare{
      @extend %fl;
      //padding-left: 64px;
      margin: 32px 0 0 10px;
      line-height: 0;
      position: relative;
      color: $c-3;
      font-size: 16px;
      @extend %clearfix;
      .bdsharebuttonbox{
        a{
          @extend %icon32;
          padding: 0;
          margin-right: 14px;
        }
        &.bdshare-button-style0-24{
          .bds_weixin{
            background-position: -0px -336px;
          }
          .bds_tsina{
            background-position: -42px -336px;
          }
          .bds_sqq{
            background-position: -0px -378px;
          }
        }
      }
      //.icon32{margin-left: 15px;}
    }
  }
  .totalAssets-tip{
    right:10px;
  }
}
.user-info{
  .info-lcol{@extend %fl;margin-top: 40px;padding-right:40px;
    position: relative;
    .activity-endorsement-iconBox{
      &.active{display: block;}
      display: none;
      position: absolute;width: 100%;
      bottom:-30px;text-align: center;
      font-size: 14px;color: #8DBD2E;
      .endorsement-icon{
        display: inline-block;
        width:22px;height: 26px;
        background: url("../images/activity/endorsement/ambassador-icon.png") no-repeat;
      }
      .endorsement-text{
        margin-top: -3px;
      }
    }
  }
  .info-rcol{@extend %dis-inlineblock;
    width: 680px;
    margin-left: 10px;
    margin-top: 40px;
    .info-s{width: 48%;@extend %fl;}
    .info-m{
      width: 46%;@extend %fl;
      border-left: 1px solid $c-f1;
      padding-left: 24px;
      .info-m-tit{
        white-space: nowrap;
        .tit{color: $c-6;font-size: 1rem;}
        .mainColor{font-size: 24px;}
        .icon-info{
          vertical-align: baseline;
          .tooltip{
            width: 260px;
            margin-left: -200px;
            &:before,&:after{
              margin-left: 51px;
            }
          }
        }
      }
      .info-m-coupon{
        margin-top: 16px;
        color: $c-9;
        width: 268px;
        height:22px;
        span.mainColor{padding: 0 4px;}
        .info-m-coupon-left{
          float: left;
        }
        .info-m-coupon-right{
          float: right;margin-right: 18px;
        }
        .info-m-coupon-left{}
      }
    }
    @at-root .icon-what{
      width: 20px;height: 22px;
      background: url("../images/icon/icon-what.png") no-repeat;
      display: inline-block;
      vertical-align: middle;
      cursor: pointer;
      &:hover{
        .totalAssets-tip{display: block;}
      }
    }
    @at-root .totalAssets-tip{
      display: none;
      position: absolute;
      top:34px;right: -30px;
      //height: 100px;
      border: 2px solid #ffd5a9;
      background-color: $c-f;
      font-size: 14px;
      padding: 10px 18px;
      border-radius: 8px;
      @extend %tl;
      &:after,&:before{
        position: absolute;
        content: '';
        display: block;
        clear: both;
        right: 71px;
        margin-left: -9px;
        border-style: solid;
        border-width: 0 8px 10px;
        border-color: transparent;
      }
      &:after{
        //background-color: red;
        top:-8px;
        border-bottom-color: $c-f;
      }
      &:before{
        top:-10px;
        border-bottom-color: #f7c998;
      }
      ul.totalAssets-tipUl{
        li{overflow: hidden;
          height: 22px;line-height: 22px;
        }
      }
      .totalAssets-tipTit{
        @extend %fl;
        color: $c-6;
        width: 100px;
      }
      .totalAssets-tipCon{
        @extend %fr;
        color: #ff8a10;
      }
    }
  }
  @at-root .u-pic{//头像
    text-align: center;
    width: 110px;
    height: 110px;
    margin-left: 40px;
    overflow: hidden;
    position: relative;
    //box-sizing: content-box;
    .mask{position:absolute;
      top:0;
      left: 0;
      width: 110px;
      height: 110px;
      background: url("../images/home/mask.png") center no-repeat;
    }
    img{
      max-height: 110px;
    }
  }
  dl.security-grade{//安全等级低
    color: $mainColorOrange;
    dt,dd{@extend %dis-inlineblock;}
  }
  //安全等级下认证状态图标
  ul.security-iconUL{@extend %w100;@extend %clearfix;
    margin-top: 16px;
    li{@extend %fl;
      width: 32px;
      height: 32px;
      margin-right: 18px;
      a{display: block;cursor: pointer;}
    }
  }
  .info-tagging{//资金流水和风险评估
    margin-top: 38px;
    .riskSmallBox{margin-left: 20px;}
  }
  .money-relevantDLBox{
    @extend %clearfix;
    //overflow: hidden;
    position: relative;
  }
  @at-root dl.money-relevantDL{//钱相磁
    @extend %tl;@extend %fl;width: 49%;
    dt{color: $c-6;font-size: 1rem;}
    dd{color: $mainColorOrange;font-size: 1.71rem;margin-top: 16px;}
  }
  .money-enterOut{//充值和提现
    font-size: 0;
    margin-top: 27px;overflow: hidden;
    .btn{width: 114px;height: 30px;line-height: 30px;
      font-size: 16px;margin-right: 18px;float: left;
    }
  }
}
.my-financing{//账户总览--
  margin-top: 20px;
  background-color: $c-f;
  padding:0 0 22px 0;
  &.martop0{margin-top: 0;}
  dl.my-financingMoneyDl{color: $c-3;
    height: 100px;
    dd{font-size: 24px;height: 60px;line-height: 60px;}
    dt{font-size: 14px;position: relative;color: $c-9;
      &:hover{
        .totalAssets-tip{display: block;}
      }
    }
    @at-root .borderRight{border-right:$c-f2 1px solid; }
  }
  .my-financing-con{
    @extend %tc;
    @extend %clearfix;
    padding-top: 20px;
    //background-color: red;
    height: 100px;
  }
  .icon-what{
    position: absolute;
    top:0;left: 50%;
    margin-left: 3.5em;
  }
}

.my-recommendProduct{//推荐投资
  background-color: $c-f;
  margin-top: 20px;
  padding: 25px;
  min-height: 400px;
  .tit{color: $c-3;font-size: 18px;}
  ul.recommendProductConUl{
    margin-top: 20px;
    @extend %tc;
    .col-1,.col-2,.col-3,.col-4,.col-5,.col-6{
      @extend %fl;
    }
    .col-1{//名称
      width: 25%;
      font-size: 14px;
    }
    .col-2{//预期年化收益
      width: 16%;
    }
    .col-3{//理财期限
      width: 15%;
    }
    .col-4{//可购金额
      width: 18%;
    }
    .col-5{//募集进度
      width: 15%;
    }
    .col-6{//立即抢购
      width: 11%;
    }
    .btn.btn-text{
      width: 100%;height:30px;line-height: 30px;
      font-size: 14px;color: $mainColorOrange;
      &:hover{
        background-color: $mainColorOrange;
        color: $c-f;
      }
    }
    li{
      &.tit{
        background-color: $c-f8;height: 40px;line-height: 40px;
        font-size: 14px;
        .col-1{
          padding-top: 0;
          line-height: 40px;
          font-size: 1rem;
        }
      }
      &.notProductLi{
        padding: 60px 0;
        border-bottom: none;
        .noRecordBox{
          margin-top:30px;
        }
      }
      font-size: 16px;
      color: $c-6;
      height: 46px;line-height: 46px;
      border-bottom: $c-f1 1px solid;
      @extend %clearfix;
      em{font-size: 12px;}
    }
  }
}
.home-tit{//个人中心标题
  margin:0 30px;
  //text-indent: 30px;
  height: 60px;
  line-height: 70px;
  border-bottom: $c-f1 1px solid;
  font-size: 1.29rem;
}


//推广页加合伙人部分
.wrap_wonderful.tycoon{
  height: 344px;
  background: #ffbdaf;
  background: linear-gradient(135deg,#ffd0a8,#ffd0a8 40%,#ffacb6 60%,#ffacb6);
  text-align: center;
  img{
    margin-top: 33px;
    display: inline-block;
  }
}
//个人中心：理财计划
//我的投资弹层
.investGroup-popupBox{
  margin: 14px 28px;
  .investGroup-popup-tit{
    height: 40px;line-height: 40px;
    background-color: $c-f8;
    text-align: center;
    overflow: hidden;
    .td1,.td2,.td3{@extend %fl;}
    .td1{text-indent: 1em;width: 50%;}
    .td2{width: 50%;}
  }
  .investGroup-popup-con{
    max-height: 240px;
    overflow-y:auto ;
  }
  .no-investGroup-popup-con{
    height: 126px;line-height: 140px;
    text-align: center;
  }
  &.colTable3{
    table.investGroup-popupTable{
      .td1{width: 40%;white-space: nowrap;}
      .td2{width: 34%;}
      .td3{width: 26%;}
    }
    .investGroup-popup-tit{
      .td1{width: 40%;white-space: nowrap;}
      .td2{width: 34%;}
      .td3{width: 26%;}
    }
    .mainColor{
      color: $mainColor;
    }
  }
  table.investGroup-popupTable{
    width: 100%;color: $c-6;font-size: 1rem;
    text-align: center;
    tbody{
      td{height: 46px;line-height: 46px;
        border-bottom:1px solid $c-f1;
      }
    }
    .td1{width: 50%;text-align: left;text-indent: 1rem;}
    .td2{width: 50%;}
  }
}
.investGroup-popupBtn{
  margin-bottom: -20px;
  text-align: center;
}
//申请赎回弹层
.investRedeem-popupBox{
  margin: 10px 28px 0;
  ul.investRedeem-popupUl{
    color: $c-9;
    li{
      //height: 40px;line-height: 40px;
      padding: 10px 0;
      input{
        height: 38px;border: 1px solid $c-db;
        border-radius: 4px;width: 200px;
        text-indent: 12px;
        vertical-align: middle;
        margin: 0 14px 0 10px;color: $c-3;
      }
      &.li2{height: 40px;line-height: 40px;}
    }
  }
  .icon-what{
    margin: 0 0 0 4px;
    position: relative;
  }
  .totalAssets-tip{
    width: 170px;height: 44px;
    right: auto;left: -20px;
    &:before,&:after{
      right: auto;left: 30px;
    }
  }
}
.investRedeem-popupBtn{
  margin-bottom: -20px;
  margin-top: 10px;
  text-align: center;
  border-top: 1px solid $c-db;
  padding-top: 20px;
}

//我的加息券
.home-interestRate{//个人中心
  @extend %home-rightBody;
  .interestRateTitUL{
    background-color:$c-f8 ;
    @extend %row4tabTit;
    li{font-size: 1.14rem;}
  }
  .interestRateBodyTit{//兑换加息券
    margin: 0 20px 20px 0 ;
    .btn{width: 146px;}
  }
  .interestRateBody{
    .notInterstRateCon{color: $c-9;font-size: 18px;margin-top: 160px;}
    .recordBox.item{
      margin: 40px 0 0 0;
      display: none;
      &.active{
        display: block;
      }
    }
  }
  ul.interestRateConUl{//加息券列表呢
    @extend %clearfix;
    margin: 0 0 0 30px;
    &.used{//已使用
      .interestRateState{
        display: block;
      }
    }
    &.disabled{//已过期
      li{ //background-color: #d7d7d7;
        .interestRateState {
          display: block;
        }
      }
    }
    li{
      position: relative;
      margin:0 24px 30px;
      height: 340px;
      width: 230px;
      background:url("../images/home/interestRateConLiConBg.png") top right no-repeat #FDC055;
      @extend %fl;
      color: $c-f;
      &.aboutToExpire{//即将到期
        .interestRateState{
          display: block;
        }
      }
      .icon-InterestRateWen{//上下的漩纹背景
        position: absolute;
        width: 100%;
        height: 5px;
        left: 0;
        background: url("../images/home/interestRateConLiTitBg.png") repeat-x -999px -999px;
        &.rateWen-top{
          top:0;
          background-position: 0 0;
        }
        &.rateWen-down{
          bottom: 0;
          background-position: 0 -5px;
        }
      }
      .interestRateCon{
        padding: 5px 8px;
      }
      dl.interestRateConTit{//
        margin-top: 10px;
        dt{font-size: 16px;}
        dd{font-size: 44px;margin-top: 4px;}
      }
      .interestRateStateBox{height: 22px;margin-top: 2px;}
      .interestRateState{//当前状态
        display: none;
        width: 68px;
        height: 22px;
        line-height: 22px;
        @extend %tc;
        background-color: rgba($c-f,0.5);
        color: #d5972a;
        border-radius: 4px;
      }
      .interestRateExplain{//使用期限等注意事项
        margin-top: 8px;
        font-size: 14px;
        line-height: 22px;
        white-space: nowrap;
        a{color: $c-f;font-size: inherit;}
      }
    }
  }
  @at-root .popup-interestRateCon{//弹层输入码
    padding-top: 6px;
    .lr-body-con{width: 420px;margin-left: 160px;}
    .login-reg-body{
      min-height: auto;
      padding:18px 0 0 0;
    }
    .lr-body-item3{margin-top: 20px;}
  }
  @at-root .popup-interestRatePrompt{//个人中心兑换券码弹层温馨提示
    margin-top: 36px;
    background-color: $c-f8;
    .reminder-box{
      //width: 480px;
      //margin: 0 auto;
      padding: 16px 0 16px 0;
    }
  }
  @at-root .interestRateBuyPopup-TableBox{//购买加息券时弹层出相的加息券相关内容
    padding-bottom: 16px;
    .couponPromptText{line-height: 20px;padding-top: 5px;}
    &.no{
      .interestRateBuyPopup-not{display: block;}
      .interestRateBuyPopup-Con{display: none;}
    }
    &.yes{
      .interestRateBuyPopup-not{display: none;}
      .interestRateBuyPopup-Con{display: block;
        .selectBox{@extend %dis-inlineblock;margin-right: 4px;}
      }
    }
    .interestRateBuyPopup-not{
      display: none;
      &.active{
        .interestRateBuyPopup-add{display: block;}
      }
      .interestRateBuyPopup-add{display: none;
        padding-top: 10px;
        .input{
          @extend %dis-inlineblock;
          width: 140px;vertical-align: middle;
          margin-right: 6px;
        }
        .btn{width: 104px;}
        span.error{vertical-align: middle;
          margin-left: 6px;white-space: nowrap;
        }
        .yzm{
          position: static;
          @extend %dis-inlineblock;
          vertical-align: middle;
        }
      }
    }
    .interestRateBuyPopup-Con{display: none;
      .selectBox{width: 180px;padding: 0 5px;height: 40px;border-color:$c-db; }
    }
  }
}
//个人中心选择银行卡和购买产品选择加息券
.selectBox {position:relative;height: 40px;line-height: normal;z-index: 2;
  border-color: red;
  input{cursor:pointer; display:block;  width:100%; overflow:hidden;
    border: none;line-height:42px;height:40px;
    border-radius:10px ;text-indent: 10px;cursor: pointer;
    background: url("../images/home/arrow-down.png") no-repeat;
    background-position:97% center;
  }
  ul.select_ul {width:100%; position:absolute; left:-1px; top:40px;
    border:1px solid #dbdbdb;border-bottom: none;
    background:#fff; overflow: hidden;display:none;
    z-index:99999;
    li {
      display:block;height:42px;overflow:hidden;
      line-height:42px;
      margin-top: 0 !important;
      width:100%;
      border-bottom: 1px solid #dbdbdb;
      cursor:pointer;
      text-indent: 10px;
      &:hover{background:$c-f5;}
      .hover{background:$c-6;}
    }
  }
}

//我的投资
.home-invest{
  @extend %home-rightBody;
  margin-top: 20px;
  .home-investTitUL{
    background-color:$c-f8 ;
    @extend %row3tabTit;
    li{font-size: 1.14rem;}
  }
  .home-investBody{
    .recordBox.item,.investRecordBox.item{
      display: none;
      &.active{
        display: block;
      }
    }
    .investRecordBox{
      margin: 0 24px;
      .investRecord-tit{
        height: 42px;line-height: 42px;
        margin-top: 24px;
        font-size: 16px;color: $c-3;
        a.pull-right.mainColor{font-size: 14px;
          cursor: pointer;
          &:hover{text-decoration: underline;}
        }
      }
      .investRecord-con-tit,.investRecord-con-text{
        height: 40px;line-height: 40px;
        border-bottom: 1px solid $c-f1;
        color: $c-6;font-size: 1rem;
      }
      .investRecord-con-tit{
        background-color: $c-f8;
      }
      .col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7{
        float:left;text-align: center;
      }
      .col-1{
        width: 17%;
      }
      .col-2{
        width: 17%;
      }
      .col-3{
        width: 15%;
      }
      .col-4{
        width: 15%;
      }
      .col-5{
        width: 16%;
      }
      .col-6{
        width: 18%;
        a{margin: 0 6px;color: $mainColor;}
      }
      ul.investRecordUl{
        &.fourColumn{
          .col-1,.col-2,.col-3,.col-4{width: 25%;}
        }
        &.fiveColumn{
          .col-1,.col-2,.col-3,.col-4{width: 20%;}
          span.mainColor{cursor: pointer;}
        }
      }
    }
  }
}
.noRecordBox{//暂无记录
  color: $c-9;@extend %tc;
  margin-top: 100px;
  .icon-unhappy{
    width: 83px;height: 83px;
    display: block;margin:0 auto 10px;
    background: url("../images/icon/unhappyIcon.png") no-repeat;

  }
}
//我要充值
.homeSmall-tit{
  display: block;
  font-size: 1rem;
  color: $c-3;
  padding-bottom: 8px;
}
.input,.selectBox{border: $c-db 1px solid;
  border-radius: 5px;
  padding: 8px 15px 8px 10px;
  width: 255px;
  height:24px;
  line-height: 24px;
  position: relative;
  &.input-half{
    vertical-align: top;
    margin-right: 4px;
    width: 138px;
  }
}

.bank_btn{margin: 30px 0;
  .btn{width: 280px;}
}
.home-recharge{
  @extend %home-rightBody;
  .home-recharge-tit{
    font-size: 1.29rem;
    height: 60px;
    line-height: 60px;
    margin: 0 30px;
    border-bottom: 1px solid $c-f1;
  }
  ul.titTab{
    li{
      float: left;
      margin-left: 30px;
      padding: 0 22px;
      height: 59px;
      cursor: pointer;
      &.active{
        color: $mainColor;
        border-bottom: 2px solid $mainColor;
      }
    }
  }

  .home-recharge-body{
    margin: 0 30px;
  }
  .home-rechargeBox{
    display: none;
    padding-bottom: 40px;
    border-bottom: 1px dashed $c-f1;
    &.active{display: block;}
    .home-recharge-p{
      font-size: 14px;
      line-height: 30px;
      color:$c-6;
      margin: 30px 0 0 0;
    }
    .bankCode{
      font-weight: bold;
      font-size: 16px;
    }
  }
  @at-root .home-lrBox{
    margin-top: 30px;
    .home-lr-tit{
      float: left;
      width: 108px;
      color:$c-3;
    }
    .moneyModeLinkage{
      display: none;
      &.active{
        display: block;
      }
    }
    .home-lrBox-row,.home-lrBox-input-row,.home-lrBox-btn-row,.home-lrBox-inputSelect-row{
      font-size: 14px;
      //overflow: hidden;
      //padding:5px 0;
      height: 40px;line-height: 40px;
      .home-lr-con{
        margin-left: 108px;
      }
      .surplus{
        color: $mainColor;
        .mainColor{font-size: 20px;}
      }
      .moneyMode{
        margin-right: 20px;
        cursor: pointer;
        font-size: 16px;
        input{
          margin-right: 4px;
        }
      }
    }
    .home-lrBox-inputSelect-row{
      overflow : visible;
      height: 76px;
      .inputAfter-title{
        color: $c-9;
        font-size: 12px;
        height: 30px;line-height: 30px;
      }
      .error{
        height: 30px;line-height: 30px;
      }
    }
    .home-lrBox-input-row{
      height: auto;
      .home-lr-con{
        position: relative;
      }
      .error{
        line-height: 20px;
      }
      padding-bottom: 8px;
      //height: 56px;
      line-height: 48px;
      .inputUpEm{
        display: block;
        color:$c-9;
        position: absolute;
        height: 36px;line-height: 36px;
        background-color: $c-f;
        padding:0 5px;
        top:50%;left: 255px;
        margin-top: -18px;
      }
      .btn{
        width: 280px;
      }
      .grey,.mainColorA{margin-left: 16px;}
    }
    .home-lrBox-btn-row{
      padding-top:10px;
    }
    .home-recharge-inputBox{
      position: relative;
      .input-half{
        vertical-align: middle;
      }
      .btn{
        width: 280px;
      }
      .btn-yzm{
        width: 108px;height: 40px;line-height: 40px;
        position: absolute;
        top:3px;left: 173px;
      }
      .lr-Inputtext{//这是input
        height: 24px;
        line-height: 24px;
        font-size: 1rem;
        padding: 8px 15px 8px 10px;
        border: 1px solid $c-db;
        border-radius: 5px;
        overflow: hidden;
        &:focus{
          outline:none ;
          border: $mainColor 1px solid;
        }
        &.lr-text-half{
          width: 134px;
        }
      }

    }

    &.popupLrBox{
      margin-left:50px;
      .home-lr-tit{color:$c-9;}
    }
  }

}
.quickBankImg{@extend %fl;
  margin-top: 2px;
  width: 150px;
  height: 44px;
  background: url("../images/home/banks-recharge.png") no-repeat -9999px -9999px;
  $quickBanks:(ICBC:-3px,ABC:-53px,BOC:-103px,CCB:-153px,GDB:-253px,
          CMBC:-303px,PSBC:-403px,CMB:-453px,CEB:-503px,SPDB:-553px,HXB:-603px,
          BOCOM:-653px,BCCB:-703px,CITIC:-753px,HKBEA:-803px
  );
  @each $quickBank,$size in $quickBanks{
    &.#{$quickBank}{
      background-position-x:10px;
      background-position-y:$size;
    }
  }
}
.btn-mainLine{
  display: inline-block;
  font-size: 12px;
  color:$mainColor;
  border: 1px solid $mainColor;
  border-radius: 4px;
  height: 20px;line-height: 20px;
  padding:0 10px;
  margin-left: 10px;
  cursor:pointer;
  //vertical-align: middle;
}
//我要提现
.homeInputBox{//基本的inpu样式呢
  .input,.inputAfter-title,.selectBox{@extend %dis-inlineblock;
    vertical-align: middle;
  }
  .input,.selectBox{margin-right: 14px;}
  .inputAfter-title{color: $c-9;}
  .selectBox{
    padding: 0;
    height: 42px;
    width: 282px;
    //overflow: hidden;
    select{
      margin-top: 6px;
      //-webkit-appearance: none;
      width: 100%;
      height: 25px;
      line-height: 25px;
      border: none;
      border-radius: 8px;
      text-indent: 10px;
      font-size: 14px;
      outline: none;
      option{
        text-indent: 10px;
      }
    }
  }
}
.icon40{
  width: 40px;height: 40px;
  display: block;
  background: url("../images/icon/icon40.png") no-repeat -9999px -9999px;
  &.num-1{
    background-position: 0 -40px;
  }
  &.num-2{
    background-position: 0 -120px;
  }
  &.num-3{
    background-position: 0 -200px;
  }
  &.num-4{
    background-position: 0 -280px;
  }
  &.num-5{
    background-position: 0 -320px;
  }
  &.tit-arrow{
    background-position: 0 -414px;
    height: 56px;
    position: absolute;
    top:0;
    /*&.arrow-1{left:209px;}
    &.arrow-2{left:526px;}
    &.arrow-3{left:568px;}*/
    &.arrow-1{left:159px;}
    &.arrow-2{left:376px;}
    &.arrow-3{left:568px;}
    //&.arrow-4{left:630px;}
  }

}
.home-inputLR-row{
  //overflow: hidden;
  position: relative;
  margin-top: 16px;
  .home-inputLR-tit{
    width: 130px;
    height: 42px;line-height: 42px;
    position: absolute;
    top:0;left: 0;
    font-size: 14px;
    color:$c-6;
  }
  .home-inputLR-con{
    position: relative;
    margin-left: 130px;
    //height: 42px;//line-height: 42px;
    position: relative;
    .home-input-text{

    }
  }
  .label-state{
    display: inline-block;
  }
  .lr-Inputtext{//这是input
    height: 24px;
    line-height: 24px;
    font-size: 1rem;
    padding: 8px 15px 8px 10px;
    border: 1px solid $c-db;
    border-radius: 5px;
    overflow: hidden;
    &:focus{
      outline:none ;
      border: $mainColor 1px solid;
    }
    &.lr-text-half{
      width: 134px;
    }
  }
  .label-state{
    margin-left: 8px;
  }
  .btn-yzm{
    height: 40px;line-height: 40px;
    width: 108px;
    position: absolute;
    top:0;left: 173px;
    &~.label-state{
      margin-left: 130px;
    }
  }
  .lr-label-agreement{
    color:$c-9;
    a,a:active,a:visited{color: inherit;}
    a:hover{text-decoration: underline;color: $c-6;}
  }
}
.btnHomeWidth{
  width: 282px;
}
.home-openDepositoryBank{
  @extend %home-rightBody;
  .home-openDepositoryBankBody{
    .openDepositoryBankBody-con{
      display: none;
      margin-top: 15px ;
      overflow: hidden;
    }
    &.step1{
      .openDepositoryBankBody-con.body1{
        display: block;
        margin-left:210px;
        .reminder-box{margin-left:0;
          padding-top: 14px;
        }
      }
      .icon40.num-1{
        background-position: 0 0;
      }
    }
    &.step2{
      .openDepositoryBankBody-con.body2{
        display: block;
        margin-top: 80px;
      }
      .icon40.num-2{
        background-position: 0 -80px;
      }
    }
    &.step3{
      .openDepositoryBankBody-con.body3{
        display: block;
        margin-top: 80px;
      }
      .icon40.num-3{
        background-position: 0 -160px;
      }
    }
    &.step4{
      .openDepositoryBankBody-con.body4{
        display: block;
        margin-top: 80px;
      }
      .icon40.num-4{
        background-position: 0 -240px;
      }
    }
    &.step5{
      .openDepositoryBankBody-con.body5{
        display: block;
        margin-top: 80px;
      }
      .icon40.num-5{
        background-position: 0 -360px;
      }
    }
  }
  .openDepositoryBankBody-titBox{
    width: 835px;
    margin:26px auto 0;
    height: 56px;line-height: 66px;
    background-color: #fff1e7;
    border-radius: 4px;
    position: relative;
    color:$mainColor;
    overflow: hidden;
    .tit-num,.tit-arrow{
      position: absolute;
      bottom:0;
    }
    .tit-num{
      &.num-1{left:40px;}
      &.num-2{left:222px;}
      &.num-3{left:422px;}
      &.num-4{left:622px;}
      //&.num-5{left:668px;}
    }
    .tit-text{
      font-size: 14px;
      float: left;
      &.tit-1{margin-left: 86px;}
      &.tit-2{margin-left: 130px;}
      &.tit-3{margin-left: 111px;}
      &.tit-4{margin-left: 122px;}
      //&.tit-5{margin-left: 90px;}

    }/*
    .tit-num{
      &.num-1{left:40px;}
      &.num-2{left:322px;}
      &.num-3{left:622px;}
      &.num-4{left:622px;}
      //&.num-5{left:668px;}
    }
    .tit-text{
      font-size: 14px;
      float: left;
      &.tit-1{margin-left: 86px;}
      &.tit-2{margin-left: 230px;}
      &.tit-3{margin-left: 211px;}
      &.tit-4{margin-left: 122px;}
      //&.tit-5{margin-left: 90px;}

    }*/
  }
}
//银行存管
.home-depositoryBank{
  @extend %home-rightBody;
  .depositoryBankBody{
    margin:24px 0 40px 30px;
  }
  .depositoryBank-infoBox{
    overflow: hidden;
  }
  .depositoryBank-accountInfo{
    float: left;
    .depositoryBank-accountInfo-row{
      overflow: hidden;
      dl.depositoryBank-accountDl{
        float: left;
        margin-top: 20px;
        padding-bottom: 10px;
        &.dl1{width: 205px;}
        &.dl2{width: 185px;}
        dt{color: $c-6;font-size: 14px;
          height: 24px;line-height: 24px;
        }
        dd{
          color:$c-3;font-size: 24px;
          height: 32px;line-height: 32px;
        }
      }
      .icon-iconLvXinBao.icon-reload{
        vertical-align: middle;
      }
      &.one-row{
        height: 32px;
        line-height: 32px;
        margin-top: 12px;
      }
      .tit,.con{
        float: left;
      }
      .tit{
        color: $c-9;
        font-size: 14px;
        width: 88px;
      }
      .con{
        color:$c-3;
        font-size: 16px;
      }
      .mainColor{
        color: $mainColor;
        margin-left: 32px;
      }
    }
  }
  .depositoryBank-card{
    float: left;
    width: 439px;
    height: 272px;
    color:$c-f;
    background: url("../images/home/depositorybankBg.png") no-repeat;
  }
  .depositoryBank-cardBox{
    width: 375px;height: 84px;
    margin: 128px 0 0 34px;
    font-size: 14px;line-height: 28px;
    position: relative;
    .btn-whiteLineText{
      display: block;
      position: absolute;
      bottom:0;right:0;
    }
  }
  .addBank-infoBox{
    margin: 30px 0;
    border-top:1px solid $c-f1 ;
    overflow: hidden;
    .addBank-info-tit{
      height: 68px;line-height: 68px;
      font-size: 18px;
      color: $c-3;
    }
    .bankCardBox{
      float: left;
      margin: 0 40px 0 0;
    }
    .bankCardBox.exhi{
      .bankCardInfo{
        .red{display: block;}
      }
    }
  }
}
//修改交易密码
.home-reviseTradePassword{
  @extend %home-rightBody;
  .reviseTradePasswordBody{
    ul.reviseTradePasswordUl{
      margin: 60px 0 0 160px;
      padding-bottom: 44px;
    }
  }
}
.home-newDrawMoney{
  //银行存管的提现页面
  @extend %home-rightBody;
  .home-newDrawMoneyBody{
    @at-root .mainColorA{
      margin-left: 10px;
      cursor: pointer;
      color: $mainColor;
      text-decoration: underline;
      &:hover{
        text-decoration: underline;
      }
      &:active,&:visited{
        color:$mainColor;
        text-decoration: underline;
      }
    }
    .home-lrBox{
      margin-left: 30px;
      padding-bottom: 40px;
      border-bottom: 1px dashed $c-f1;
      .home-lr-tit{
        color:$c-9;
      }
    }
  }

}
.home-drawMoney{
  @extend %home-rightBody;
  .home-drawMoneyBody{

  }
  .drawMoney{display: none;
    &.active{display: block;}
    &.step1{
      .drawMoneyCon{margin-left: 230px;}
      dl.amountOkDl{
        margin-bottom: 30px;
        color: $c-3;font-size: 1rem;
        dt,dd{@extend %dis-inlineblock;}
      }
      //.amoutOkBox{width: 100%;}
    }
    @at-root .drawMoneyCon{margin: 80px auto 0;
      &.step2{
        width: 188px;
      }
    }

  }
}
//交易记录
.recordBox{//记录列表
  margin: 36px 0;
  .col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9{
    @extend %fl;
  }
  .col-1{//投资时间
    width: 10%;
  }
  .col-2{//标的名称
    width: 18.5%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
  .col-3{//投资金额
    width: 14.5%;
  }
  .col-4{//收益率
    width: 8%;
  }
  .col-5{//期限
    width: 10.5%;
  }
  .col-6{//预期收益（元）
    width: 14.5%;
  }
  .col-7{//已筹金额
    width: 14.5%;
  }
  .col-8{//查看协议
    width: 9%;@extend %fr;
  }
  .recordBoxUl-titBox{
    @extend %tc;margin: 0 25px;
    height: 40px;line-height: 40px;
    border-bottom: 1px solid $c-f1;
    &.whole,&.fuller,&.stay{//回款中or募集中or待支付
      .col-1{width:11%; }
      .col-2{width:21.5%; }
      .col-4{width:14%; }
      .col-5{width:10%; }
    }
    &.notFull{
      .col-1{width:10%; }
      .col-2{width:17%; }
      .col-3{width:14.5%; }
      .col-4{width:14%; }
      .col-5{width:8.5%; }
      //.col-6{width:22.5%; }
      .col-7{width:12.5%; }
      //.col-8{width:10%; }
    }
    &.dayBookTable{//交易记录
      overflow: hidden;
      .col-1{width: 30%;font-size: 14px;padding: 0;line-height: 46px;}
      //.col-2{width: 26%;}
      .col-3{width: 20%;}
      .col-4{width: 30%;}
      .col-6{width: 20%;}
    }
  }
  ul.recordBoxUl{
    @extend %tc;
    &.whole,&.notFull,&.fuller,&.stay,&.dayBookTable{
      .col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9{
        @extend %fl;
      }
    }
    &.dayBookTable{//交易记录
      margin: 0 25px;
      &>li{height: 46px;line-height: 46px;
        border-bottom: $c-f1 1px solid;
      }
      .col-1{width: 30%;font-size: 14px;padding: 0;line-height: 46px;}
      //.col-2{width: 26%;}
      .col-3{width: 20%;}
      .col-4{width: 30%;}
      .col-6{width: 20%;}
    }
    .col-1{//投资时间
      width: 10%;
      line-height: 18px;
      font-size: 12px;
      //height: 46px;
      padding-top: 5px;
    }
    &.whole,&.fuller,&.stay{//回款中or募集中or待支付
      .col-1{width:12%; }
      .col-2{width:22.5%; }
      .col-4{width:12%; }
      .col-5{width:10%; }
    }
    &.whole,&.notFull,&.fuller,&.stay{//回款中or已结清or募集中
      &>li{
        &.tit{padding: 0 25px;}
        .recordBoxUl-titBox{height:inherit;border-bottom: 1px solid $c-f1;}
      }
    }
    &.notFull,&.stay{//已结清or待支付

    }
    &.notFull{
      .col-1{width:10%; }
      .col-2{width:17%; }
      .col-3{width:14.5%; }
      .col-4{width:12%; }
      .col-7{width:12.5%;}
    }
    &.fuller{//募集中
      .btn.btn-line{width: 70px;height:30px;line-height: 30px;}
    }
    &.stay{//待支付和
      .btn.btn-line{width: 60px;height:30px;line-height: 30px;}
      .btn.btn-cancel{
        width: 30px;
        font-size: 0.86rem;color: $c-9;
        @extend %dis-inlineblock;
      }
    }
    &>li{
      font-size: 1rem;
      color: $c-6;
      &.advanceSettle{
        .recordBox-li-titBox{
          .col-7{
            position: relative;
            &:after{
              display: block;
              content: '';
              width: 75px;
              height: 44px;
              background:url("../images/home/advanceSettle.png") no-repeat;
              position: absolute;
              top:1px;right:-44px;
            }
          }
          .col-8{
            position: relative;
          }
        }
      }
      .recordBox-li-titBox{
        height: 46px;line-height: 46px;
        margin: 0 25px;
        border-bottom: 1px solid lighten($c-db,5%);
      }
      .recordBox-li-conBox{
        background-color: $c-f8;
        margin-top: -1px;
        padding: 0 25px;
        display: none;
        .recordBox-li-conBox-tit{
          height: 30px;line-height: 30px;
          font-size: 14px;
          padding: 15px 0;
          border-bottom: 1px solid $c-f1;
          @extend %tl;
          text-indent: 28px;
          .btn-line{height: 28px;line-height: 28px;
            width: 80px;
            text-indent: 0;
            margin-right: 18px;
          }
          cite{color: $c-6;}
          span{color: $mainColor;margin-right: 20px;}
        }
        ul.recordBox-li-conBoxUl{
          li{
            overflow: hidden;
            &.tit{height: 40px;line-height: 40px;}
            border-bottom: 1px solid $c-f1;
            height: 56px;line-height: 56px;
            .col-1{
              font-size: 1rem;
              line-height:inherit;
              padding-top: 0;
              width: 10%;
            }
            .col-2{width: 12%;}
            .col-3{width: 18%;}
            .col-4{width: 18%;}
            .col-5{width: 18%;}
            .col-6{width: 12%;}
            .col-7{width: 12%;}
          }
        }
      }
    }
  }
}
//交易记录
.home-daybook{
  @extend %home-rightBody;
  .sorting-filtering{//筛选排序
    margin: 30px 30px 0;
    font-size: 14px;
    color: $c-6;
    .sorting-filtering-row{margin-bottom: 10px;
      @extend %clearfix;
      height: 28px;
    }
    .filtering-tit,.filtering-con{
    }
    .filtering-tit{
      @extend %fl;
      width: 60px;
      height: 28px;
      line-height: 28px;
    }
    .filtering-con{
      margin-left: 60px;
    }
    ul.filteringUl{
      @extend %clearfix;
      li{
        @extend %fl;
        @extend %tc;
        cursor: pointer;
        height: 28px;
        padding: 0 10px;
        line-height: 28px;
        border-radius: 4px;
        margin-right: 14px;
        &.li1{width: 80px;padding: 0;}
        &.active{
          background-color: $mainColor;
          color: $c-f;
          .filter-more{color: $c-f;
            .icon-more{
              background-position: 0 -16px;
            }
          }
        }
        .filter-more{color: $mainColor;
          .icon-more{
            background-position: 0 0;
          }
        }
      }
    }

  }
}

.icon-more{
  width: 16px;
  height: 16px;
  @extend %dis-inlineblock;
  vertical-align: middle;
  margin-left: 4px;
  background: url("../images/icon/icon-more.png") no-repeat;
}
//信息披露、关于我们、监管法规 左侧菜单
.nav-adh{
  text-indent: 26px;
  background-color: $c-f;
  margin-bottom: 10px;
  .icon-more{
    margin-left: 20px;
    background-position: 0 -32px;
  }
  .nav-adh-tit{
    height: 44px;
    line-height: 44px;
    font-size: 16px;
    color:$c-3;
    cursor: pointer;
    .oneA{
      display: block;
    }
    &.active{
      .icon-more{background-position: 0 -48px;}
      a.oneA{color: $mainColor;
        //background-color: yellow;
      }
    }

  }
  ul.nav-adh-conUl{
    display: none;
    font-size: 14px;
    color:$c-6;
    padding-bottom: 20px;
    &>li{
      //height: 48px;
      line-height: 48px;
      position: relative;
      //background-color: #f5f5f5;
      &.active{
        &> .nav-adh-ALink{
          color: $mainColor;
        }
        &:after{
          position: absolute;
          content: '';
          display: block;
          width: 2px;
          height: 24px;
          background-color: #ff6700;
          left: 0;
          top: 12px;
        }
        .icon-more{background-position: 0 -48px;}
      }
    }
    .nav-adh-ALink{
      cursor: pointer;
      .icon-more{margin-left: 6px;}
    }
    a.nav-adh-ALink{
      display: block;
      height: inherit;
      color:inherit;
      &:hover{
        color: $mainColor;
      }
    }
  }
    ul.nav-adh-conChildUl{
      display: none;
      text-indent: 36px;
      li{
        &.active{
          a.nav-adh-ALink{
            color: $mainColor;
          }
        }
      }
    }
}
//投资人风险承受能力评估
.home-riskAssessment{
  @extend %home-rightBody;
}
.riskAssessmentBox{
  margin: 20px 44px 0 44px;
  dl.riskAssessmentBoxDl{
    dt{font-size: 16px;color: $c-3;margin-top: 30px;}
    dd{
      font-size: 14px;
      color: $c-6;
      margin-top: 8px;
      line-height: 28px;
      label{margin-right: 36px;}
      input{margin-right: 6px;}
    }
  }
  .riskAssessmentDescribe{
    color: $c-9;margin-top: 30px;
    line-height: 24px;
  }
  .riskAssessmentBtn{
    margin-top: 50px;
    @extend %tc;
    .btn{width: 280px;}
  }
}
.margintop28{margin-top: 28px;}
//我的银行卡
.home-bankCard{
  @extend %home-rightBody;
  .home-bankCardBody{display: none;
    &.active{display: block;}
    margin: 30px;
    @at-root .bankCardBox{
      &:hover{
        border-color: $mainColor;
        .icon-addBankCard{
          background-position: -42px -126px;
        }
        .bankCardConText{color: $mainColor;}
      }
      @extend %tc;
      width: 264px;
      height: 150px;
      border-radius: 5px;
      display: block;
      border: $c-f1 1px solid;
      color: $c-6;
      .icon-addBankCard{margin:40px auto 20px;}
      &.addBtn{//加银行卡

      }
      &.exhi,&.exhiOld{//银行卡展示
        &:hover{
          .bankCardInfo{
            .red{display: block;}
          }
        }
        .exhi-tit{
          height: 44px;
          position: relative;
          &.bg-grey{
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
            background-color: $c-f8;
          }
          .bankTit{
            display: block;
            text-align: left;
            text-indent: 15px;
            line-height: 44px;
            font-size: 16px;
            color:$c-3;
          }
          .bankCardLastNum{
            height: 44px;line-height: 44px;
            position: absolute;
            top:0;right: 16px;
          }
        }
        .bankCardInfo{
          margin:54px 15px 12px;@extend %clearfix;
          color: $c-6;
          &> div{margin-top: 5px;
            height: 20px;line-height: 20px;
          }
          .btn-whiteLineText{
            height: 24px;line-height: 24px;
          }
          .red{display: none;}
        }
      }
      &.exhi{
        border-color: transparent;
        background:#feb432 url(../images/home/bank-bg.png) no-repeat 12px 102px;
        &:hover{
          border-color: transparent;
        }
        .bankCardBoxNum{
          margin-top: 36px;
          color: #FFFFFF;
          font-size: 18px;
        }
      }
      &.exhiOld{

      }
    }
    .addBankCardBody{//填加或修改银行卡
      .bank_btn{
        //.btn{width: 134px;margin-right: 10px;}
        .btn.btn-default{width: 280px;}
        .btn.btn-default2{width: 134px;margin-right: 10px;}
      }

    }
    ul.addBankCardBodyUl{
      margin-left: 210px;
      li{margin-top: 14px;
        .input-half{margin-right: 10px;width: 130px;}
        .btn-line{
          width: 110px;
          margin-right: 20px;
        }
        .bank_btn{margin-top: 10px;}
        span.placeholder{
          padding-left: 0 !important;
          //margin-left: -295px !important;
        }
      }
    }
  }
  .home-replaceBankCardBody{//更换银行卡页面
    padding-top: 20px;
    .replaceBankCardCon{
      margin-top: 20px;
      .replaceBankCardCon-left{
        @extend %dis-inlineblock;@extend %tr;
        width: 38%;
        padding-right: 20px;
        color: $c-6;
        vertical-align: top;
      }
      .replaceBankCardCon-right{
        @extend %dis-inlineblock;
        width: 58%;
      }
      .input, .selectBox{width: 274px;}
      .myselect{position: absolute;top:0;left: 0;}
      .replaceBankCard-imgBox{
        height: 80px;
        .imgBox{@extend %fl;margin-right: 20px;
          border: $c-db 1px solid;
          border-radius: 6px;
          width: 138px;
          height: 78px;
          position: relative;
          //cursor: pointer;
          overflow: hidden;
          .imgPreviewBox{
            display: none;
          }
          img{width: 100%;height: 100%;
            position: absolute;left: 0;top:0;
            z-index: 2;
          }
          .icon-addBankCard{
            position: absolute;
            left: 50%;top:50%;
            margin-left: -16px;
            margin-top: -16px;
            z-index: 1;
          }
          .file{
            position: absolute;
            top:0;left: 0;
            height: 100%;
            width: 100%;
            font-size: 500px;
            opacity: 0;
            filter: alpha(opacity=0);
            cursor: pointer;
            z-index: 3;
          }
        }
      }
      .error{padding-top: 5px;padding-bottom: 4px;}
      .prompt-text{//提示文字
        //margin-top: 10px;
        width: 70%;
        line-height: 24px;
        color: $c-9;
      }
      &.state2,&.state3{
        .replaceBankCardCon-left{line-height: 42px;}
        .replaceBankCardCon-right{position: relative;}
        .error{padding: 0;position: absolute;bottom:-18px;left: 0;}
      }
      &.state2{
        .selectBox{z-index: 5;}
      }
      &.state3{
        .selectBox{z-index: 4;}
      }
      &.state2Con,&.state3Con{//height: 170px;
      }
      .stateCon-1,.stateCon-2,.stateCon-3{display: none;}
      &.item1{//选择各种状态对应显示不一样的内容
        .stateCon-1,.stateCon-2,.stateCon-3{display: none;}
        .stateCon-1{display: block;}
      }
      &.item2{
        .stateCon-1,.stateCon-2,.stateCon-3{display: none;}
        .stateCon-2{display: block;}
      }
      &.item3{
        .stateCon-1,.stateCon-2,.stateCon-3{display: none;}
        .stateCon-3{display: block;}
      }
      &.state4{//下一步及上一步按钮喽
        .bank_btn{
          margin: 0;
          .btn{width: 120px;margin-right: 10px;}
        }
      }
      &.state5{
        .reminder-box{margin: 0;padding-top: 0;}
      }
    }
  }
}
//安全设置
.home-safeSetting{
  @extend %home-rightBody;
  .safeSettingBody{
    .avatar-con{
      width: 290px;
      margin: 40px auto 0;
      .u-pic{
        float: left;
        margin: 0 42px 0 0;
      }
      .user-name {
        padding: 36px 0 0;
        font-size: 1.14rem;
        color: $c-3;
      }
      .security-level-con {
        margin-top: 11px;
        font-size: 1.14rem;
        color: $c-6;
        .security-level{color: $mainColor;}
      }
    }
    .detail-info-con{
      margin:50px 30px 30px 30px;
      ul.info-listUl{
        li{height: 58px;line-height: 58px;
          border-bottom: $c-f1 1px solid;font-size: 0;
          @extend %clearfix;
          &.active{
            .infoSuccess{display: block;
              padding-top: 0;
            }
            .notyet{display: none;}
          }
          .infoSuccess{
            display: none;
          }
          .col-1,.col-2,.col-3,.col-4{@extend %dis-inlineblock;
            font-size: 1rem;color: $c-3;
          }
          .col-1{width: 17%;}
          .col-2{width: 50%;position: relative;
            color: $c-9;
            .infoSuccess{

              .tip{position: absolute;
                top:-25px;left: 0;
                //text-indent: -4px;
                line-height: 20px;
                //font-size: 12px;
                //padding-top: 6px;
              }
            }
          }
          .col-3{width: 14%;}
          .col-4{width: 19%;@extend %tr;color:$c-9;
            .infoSuccess{}
          }
        }
      }
    }
  }
}
//个人中心统一的居中input样式
ul.homer-UnitedInputUl{@extend %tc;
  width: 282px;margin:30px auto 0;
  li{
    .onetotwo{height: 42px;}
    .inputEyeBox{position: relative;}
    .error{
      padding: 10px 0;
      color: $mainColor;
      @extend %tl;
    }
    .yzm{position: static;@extend %dis-inlineblock;
      height: 42px;
    }
    .btn-yzm{width: 106px;}
    &.agreementLi{//协议喽
      white-space: nowrap;
      margin: 0 0 10px 0;
    }
    &.textOnly{
      margin-bottom: 16px;
      text-align: left;

    }
  }
}
//开通个人账户
.home-individualAccount{
  @extend %home-rightBody;
  .individualAccountBody{
    .individalAccountCon-tit{
      font-size: 1.14rem;
      color: $mainColor;
      padding:20px 0;
    }
  }
}

//开通企业账户
.home-companyAccount{
  @extend %home-rightBody;
  .companyAccountBody{
    padding: 40px 0;
    .companyAccountStep1Body,.companyAccountStep2Body,.companyAccountStep3Body{
      display: none;
    }
    &.step1{
      .companyAccountStep1Body{display: block;}
    }
    &.step2{
      .companyAccountStep2Body{display: block;}
    }
    &.step3{
      .companyAccountStep3Body{display: block;}
    }
  }
  .companyAccountTip{
    border: $c-f1 1px solid;
    background-color: #fff7d2;
    padding: 16px 24px;
    line-height: 22px;
    font-size: 14px;
    color: #ff6600;
    width: 500px;
    margin:0 auto 40px auto;
  }
  ul.companyAccountFormUl{
    &>li{
      height: 64px;
      &.city_chinaLi{
        *height:100px;
      }
      .companyAccountFormUl-tit{width: 270px;padding-right: 30px;
        @extend %fl;@extend %tr;
        line-height: 44px;
      }
      .companyAccountFormUl-con{
        @extend %fl;
        .companyAccountInput-row{width: 580px;}
        .error{
          height: 22px;
          line-height: 22px;
          white-space: nowrap;
        }
        //input宽度
        .long{width: 380px;}
        .medium{width: 340px;}
        .small{width: 210px;}
        span.red{margin-left: 8px;}
      }
    }
  }
  .selectBox{
    display:inline;display: inline-block;vertical-align: middle;
    padding-top: 0;height: 32px;//z-index: 1;
    *float: left;
    input{text-indent: 0;}
  }
  #city_china{
    select{
      border-color:$c-db ;padding:10px 8px;margin-right: 4px;
      outline: none;
    }
  }
  .companyAccoutBtnBox1{width: 20%;padding-left: 325px;}
  .companyAccoutBtnBox2{width: 40%;margin:40px 0 0 80px;}
  .companyAccountStep3Body{padding-top: 40px;}
  .companyAccountStep2Body{
    width: 630px;margin-left:260px;
  }
  .companyAccountUp-tit{
    font-size: 18px;color: $c-3;
    height: 40px;
    label{
      margin-left: -22px;
      input{margin-right: 8px;width: 13px;height: 13px;}
    }
  }
  .companyAccountUp-row{
    //overflow: hidden;
    height: 60px;
    .selectBox{
      @extend %fl;width: 150px;
    }
    &.uploading{
      .companyAccountUp-row-con{
        .icon-up.icon-uploading{display: inline-block;}
      }
    }
    &.upsuccess{
      .companyAccountUp-row-con{
        .icon-up.icon-upsuccess{display: inline-block;}
      }
    }
    .companyAccountUp-row-tit{
      @extend %fl;width: 106px;
      font-size: 14px;color: $c-6;
      height: 30px;line-height: 30px;
      .selectBox{width: 106px;}
    }
    a.simulateBtn{
      width: 98px;height: 28px;line-height: 28px;
      text-align: center;
      font-size: 14px;
      color: $mainColor;
      border: 1px solid $mainColor;
      border-radius: 4px;
      cursor: pointer;
      margin-left: 16px;
    }
    .companyAccountUp-row-con {
      @extend %fl;
      .simulateBtnUpState-row{width: 200px;height: 30px;}
      .error{height: 22px;line-height: 22px;text-indent: 16px;white-space:nowrap;}
      .simulateBtnBox {
        display: inline-block;
        *float:left;
        vertical-align: middle;
        margin:0 8px 0 16px;
        position: relative;
        width: 100px;height: 30px;
        line-height: 30px;
        overflow: hidden;
      }
      .icon-up{
        width: 16px;height: 16px;
        display: none;
        vertical-align: middle;
        *float:left;*margin-top:6px;
        &.icon-upsuccess{
          background: url("../images/home/upsuccess.png") no-repeat;
        }
        &.icon-uploading{
          background: url("../images/home/uploading.gif") no-repeat;
        }
      }
      .upfile{
        filter: alpha( opacity=0) ;
        opacity: 0;
        position: absolute;
        top:0;left: 0;
        width: 100%;
        height:30px ;
        font-size: 100px;
        z-index: 2;
      }
      .simulateBtn {
        position: absolute;
        z-index: 1;top:0;left: 0;
        width: 98px;height: 28px;line-height: 28px;
        text-align: center;
        font-size: 14px;
        color: $mainColor;
        border: 1px solid $mainColor;
        border-radius: 4px;
        cursor: pointer;
      }
    }
  }
  .companyAccountUp-hr{
    border-top:1px solid $c-db;
    width: 830px;
    //padding-bottom: 40px;
    margin:50px 0 40px -240px;
  }
}
//绑定邮箱
.home-bindEmail{
  @extend %home-rightBody;
  .bindEmailBody{
  }
}
.home-editPhone{
  @extend %home-rightBody;
  .editPhoneBody{
    .drawMoneyCon{display: none;
      &.active{display: block;}
    }
  }
}
//重置支付密码
.home-resetPayPassword{
  @extend %home-rightBody;
  .resetPayPasswordBody{
    margin:0 30px;
  }
  dl.resetPayPasswordBodyDl{
    dt{color: $mainColor;font-size: 1.14rem;
      margin-top: 30px;
    }
    dd{font-size: 1rem;color: $c-9;line-height: 26px;
      margin-top: 4px;
      padding-bottom: 20px;
    }
    p{margin: 0;padding:0;}
    .btn.btn-default2{margin-top:24px;}
  }
}
//关于我们和帮助中心
.ahBox {
  margin: 20px 0 20px 0;
  & > .container {
    @extend %clearfix;
  }
  nav { //左侧菜单
    @extend %fl;
    width: 205px;
    ul.nav-ah{
      li{
        height: 52px;
        line-height: 52px;
        margin-bottom: 1px;
        text-indent: 24px;
        border-bottom: $c-f2 1px solid;
        background-color: $c-ea;
        //color: $c-3;
        font-size: 1.14rem;
        transition: all 1s;
        &.active{
          background-color: $mainColor;
          a{color: $c-f;}
        }
        &:hover{
          a{color:$c-f;}
          background-color: $mainColor;
        }
        a{display: block;}
      }
    }
  }
  .ah-body{
    overflow: hidden;
    color: $c-6;
    margin-left: 220px;
    background-color: $c-f;
    p{margin:0 0 24px 0;}
    line-height: 26px;
  }
  //监管法规
  .regulationCon{
    padding: 20px 40px 50px 40px;
    p.tit1{
      font-size: 1.25rem;
      text-align: center;
      line-height: 2.6rem;
      color: $c-0;
      margin-bottom:0;
    }
    p.tit2{
      font-size: 1.125rem;
    }
    p{
      font-size: 1rem;
      text-indent: 2em;
    }
    p.no-textIndent{
      text-indent: 0;
    }
  }
  //安全保障
  .ah-security{
    margin: 0 20px;
    .security-titBox{
      font-size: 28px;
      position: relative;
      color:#3c8fdd;
      height: 70px;line-height: 70px;
      text-align: center;
      &:after{
        position: absolute;
        content: '';
        display: block;
        width: 100%;
        height: 0;
        border-bottom:1px dashed #3c8fdd;
        top:50%;
      }
      .security-tit{
        background-color: $c-f;
        position: relative;
        z-index: 2;
        display: inline-block;
        padding: 0 10px;
      }
    }
    .security-con-tit{
      height: 30px;
      font-size: 18px;
    }
    .security-con-text{
      padding-bottom: 30px;
    }
    .security-icon{
      width: 190px;
      height: 190px;
      background: url("../images/about/security-icon.png") no-repeat;
      &.icon-1{background-position: 0 0;}
      &.icon-2{background-position: 0 -245px;}
      &.icon-3{background-position: 0 -490px;width: 245px;height: 245px;}
      &.icon-4{background-position: 0 -735px;}
      &.icon-5{background-position: 0 -980px;}
    }
    .security-con{
      width: 495px;
      float: left;
    }
    .security-conBox{
      padding: 20px 0;
      overflow: hidden;
      &.con1,&.con5{
        .security-con{
          margin: 10px 0 0 34px;
        }
        .security-icon{
          float:right;
          margin-right: 52px;
        }
      }
      &.con3{
        .security-con{
          margin: 10px 0 0 34px;
        }
        .security-icon{
          float:right;
          margin-right: 22px;
        }
      }
      &.con2,&.con4{
        .security-con{
          //margin: 0 0 0 34px;
        }
        .security-icon{
          float:left;
          margin:0 90px 0 30px;
        }
      }
    }
  }
  .ah-bodyTit{font-size: 1.428rem;
    height: 60px;
    color: $c-3;
    line-height: 60px;
    text-indent: 27px;
    border-bottom: 1px solid $c-db;
  }
  .ah-bodyTitSamll{
    font-size: 1.14rem;
    color: $c-3;
    display: block;
    padding-bottom: 10px;
  }
  //运营报表
  .ah-operationReport{
    margin: 0 30px;
    .intr {
      font-size: 12px;
      color: #666;
      //width: 880px;
      margin: 0 auto;
      padding-top: 33px;
      line-height: 28px;
    }
    .time-line {
      border-bottom: 1px solid #e6e6e6;
      clear: both;
      padding-bottom: 18px;
      //width: 880px;
      height: 42px;
      margin: 30px auto 0;
      li{
        position: relative;
        float: left;
        margin-right: 30px;
        &:hover,&.active{
          .point{background: #ffc800;}
          .arrow{
            display: block;
          }
          a{
            border-radius: 3px;
            -webkit-border: 3px;
            color: #fff;
            background: #ffc800;
          }
        }
        a{
          font-size: 20px;
          color: #999999;
          line-height: 42px;
          width: 100px;
          display: block;
          text-align: center;
          height: 42px;
        }
      }
      .arrow {
        width: 0;
        height: 0;
        border-top: 8px solid #ffc800;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        position: absolute;
        bottom: -8px;
        left: 50%;
        margin-left: -8px;
        display: none;
      }
      em.point {
        width: 8px;
        height: 8px;
        display: block;
        position: absolute;
        bottom: -23px;
        left: 45px;
        border-radius: 50%;
        -webkit-border: 50%;
        background: #e6e6e6;
      }
    }
    .list {
      padding: 50px 0 0;
      //width: 877px;
      overflow: hidden;
      ul{
        margin-left: 70px;
      }
      li{
        border: 1px solid #e6e6e6;
        float: left;
        margin-right: 65px;
        padding: 5px;
        cursor: pointer;
        margin-bottom: 60px;
        width: 280px;
        transition: border .5s linear;
        display: list-item;
        text-align: -webkit-match-parent;
        img{
          width: 280px;
        }
        &:hover{
          border-color:#ffc800;
          .arrow{
            background-position: 0 0;
          }
        }
        a{
          &:hover{
            color:#ffc800;
          }
        }
        p{
          font-size: 16px;
          padding: 20px 0 20px 10px;
          line-height: 16px;
          margin: 0;
        }
        .arrow {
          width: 22px;
          height: 22px;
          float: right;
          background: url(../images/about/arrow.png) 0 -22px;
          margin-top: -3px;
          margin-right: 10px;
        }
      }
    }
  }
  //企业资质和荣誉
  .ah-honor{
    margin: 20px 30px 0;
    @extend %home-rightBody;
    text-align: center;
    ul.honorUl{
      overflow: hidden;
      margin-top: 50px;
      &>li{
        float: left;
        margin: 0 0 36px 18px;
      }
    }
    .honor-image,honor-image img{width: 243px;height: 205px;display: block;}
    .honor-image-tit{color:$c-6;font-size: 14px;
      height: 56px;line-height: 56px;
    }
  }

  //关于我们
  .ah-about{
    margin: 20px 30px 0;
    @extend %home-rightBody;
    .manageTeam{
      .manageTeamItem{margin:35px 0 60px 0;}
      .teamPic{
        display: none;
        @extend %fl;
        width: 160px;height: 160px;
        border-radius: 50%;
        background-color: $c-db;
      }
      dl.teamInfo{//margin-left: 200px;
        dt{color: $c-3;font-size: 1.29rem;
          margin-bottom: 10px;
          .notes{font-size: 1rem;padding-left: 12px;}
        }
      }
    }
    .regulatorList{
      .regulatorItem{margin:35px 0 60px 0;
        overflow: hidden;
      }
      .regulatortPic{
        @extend %fl;
        margin-right: 25px;
        width: 161px;height: 160px;
        //border-radius: 50%;
        //background-color: $c-db;
      }
      dl.regulatorInfo{//margin-left: 200px;
        dt{
          color: $c-3;font-size: 1.29rem;
          margin-bottom: 10px;
        }
      }
    }
    ul.legislationUl{
      //margin-bottom: 60px;
      li{
        padding-bottom:30px;
        border-bottom: 1px dashed $c-db;
        margin-bottom: 30px;
      }
      .legislation-tit{
        color: $c-3;font-size: 1.29rem;
        margin-bottom: 10px;
      }
      .legislation-con{}
    }
  }
  //交易结构
  .ah-tradingStructure{
    //margin: 0 30px;
    @extend %home-rightBody;
    margin: 0;
    p.text-center{
      margin-top: 30px;
    }
    .tradingStructure-introduce{
      width:720px;height:125px;
      background-color: #f5f5f5;
      border-radius: 4px;text-align: center;
      margin: 50px auto;
    }
    .tradingStructure-introduce-tit{
      font-size: 16px;color: #333;
      font-weight: bold;padding-top: 14px;
      line-height: 40px;height: 40px;
    }
  }

  //公司大事件
  .ah-milestone{
    margin: 20px 27px 0 56px;
    @extend %home-rightBody;
    @at-root .mainColor{color: $mainColor;}
    .ah-milestone-years{
      position: relative;
      overflow: hidden;
    }
    .ah-milestone-years-line{
      width: 1px;height: 100%;
      position: absolute;
      background-color: #ebeaea;
      left: 73px;top:50px;
    }
    .ah-milestone-years-tit{//年的标题
      color: $c-6;
      font-size: 20px;
      font-weight: bold;
      height: 36px;
    }
    .ah-milestone-monthLi{//月的分割
      position: relative;
      padding-bottom: 26px;
      background: url("../images/about/dot.png") 68px 8px no-repeat;
    }
    .ah-milestone-month-tit{//月的标题
      color: $c-9;font-size: 16px;
      position: absolute;
      top:2px;left: 50%;
      margin-left: -377px;
      @extend %tr;
    }
    ul.ah-milestone-dayUl{
      margin-left: 138px;
    }
    ul.ah-milestone-dayUl{
      color: $c-6;
      font-size: 14px;
      a{color: $c-6;
        &:hover{color: $mainColor;}
      }
    }
    .ah-milestone-dayLi{
      height: 30px;
      span.tit{width: 72px;@extend %dis-inlineblock;}
    }
  }
  //最新动态媒体报道
  @at-root .redDot{
    width: 6px;
    height: 6px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 8px;
    background: url("../images/about/dot2.png") no-repeat;
  }
  .newsList{margin: 0 27px;
    @extend %home-rightBody;
    padding-bottom: 0;
    ul.newsListUL{
      li{
        &:hover{background-color: $c-f6;}
        position: relative;
        border-bottom: $c-f6 1px solid;
        height: 63px;
        line-height: 63px;
        text-indent: 20px;
        a{display: block;}
        time{position: absolute;
          top:0;right: 30px;
          height: 63px;
          display: block;
        }
      }
    }
  }
  //新闻详情页
  .newscontent{
    .ah-bodyTit{height:60px;border-bottom: $c-f1 1px solid;}
    .newsCon{margin: 30px;}
    .newsConFooter{margin: 30px 0;@extend %tr;padding-right: 30px;}
  }
  //联系我们
  .ah-contact{
    @extend %home-rightBody;
    margin: 20px 27px 0;
    p{margin-bottom: 0;}
    .ewmBox{
      margin-top: 10px;
    }
    .ewm{
      margin-right: 25px;
      @extend %dis-inlineblock;
      @extend %tc;
      img{
        border: $c-db 1px solid;
        width: 130px;
        height: 130px;
      }
    }
  }
  //加入我们\帮助中心
  .ah-jobs,.ah-help{
    @extend %home-rightBody;
    margin: 0 27px;
    .toemail{
      font-size: 16px;
      font-weight: bold;
      color: $c-3;
    }
  }
  .ah-jobs{margin-top: 30px;}
  //关于我们帮助中心，内容标题先项卡切换
  .ahTabDl{
    dt{
      &.active{
        .icon16.icon-ah{background-position: 0 -208px;}
      }
      height: 40px;line-height: 40px;
      background-color: $c-f6;
      text-indent: 18px;
      position: relative;
      color: $c-3;
      font-size: 1rem;
      cursor: pointer;
      margin-bottom: 20px;
      .icon16.icon-ah{
        background-position: 0 -234px;
      }
    }
    dd{
      &.active{display: block;}
      display: none;
      padding:26px 28px 36px;
    }
  }
  //帮助中心充值提现表格样式
  @at-root table.defaultTable{
    width: 100%;
    margin-top: 15px;
    caption{
      height: 42px;line-height: 42px;
    }
    thead{
      td{background-color: $c-f1;}
    }
    td{
      text-align: center;
      height: 36px;line-height: 36px;
      &.textIndent{
        text-indent: 2em;
        line-height: 24px;
        text-align: left;
        padding:10px;
      }
    }
    &.text-left{
      td{
        text-align: left;
      }
    }
    tbody{
      tr:nth-child(even){
        td{background-color: $c-f8;}
      }
    }
    &.noviceGreenTable{
      color: $c-6;
      tbody{
        td{border-bottom:1px solid $c-ec; }
        tr:nth-child(even){
          td{background-color: transparent;}
        }
      }
      .td1{width: 22%;}
      .td2{width: 26%;}
      .td3{width: 26%;}
      .td4{width: 26%;}
    }
    &.borderTable1{
      border:$c-f1 1px solid;
      tbody{
        tr:nth-child(even){
          td{background-color: $c-f;}
        }
      }
      td{
        border-top:$c-f1 1px solid;
      }
    }
    &.moreTextTable{
      td{text-align: left;
        &.td1{width: 140px;padding-left: 40px;}
        &.td2{width: 280px;text-align: center;}
        &.td3{//text-align: center;
          line-height: 22px;
          padding: 15px 40px 15px 0 ;

        }
      }
      thead{
        td{
          text-align: center;
        }
      }
    }
    &.borderTableWhite{
      border:$c-f 1px solid;
      td{border:$c-f 1px solid;}
    }
    &.tableGrayAndGray{
      .td1{width: 20%;text-align: center;}
      tbody{
        tr{
          td{
            background-color: #eceff1;
            padding:20px 15px;
            line-height: 24px;
            text-align: left;
          }
        }
        tr:nth-child(even){
          td{background-color:#f6f8f9;}
        }
      }
    }
    &.agreementTable{
      border:$c-db 1px solid;
      td{border:$c-db 1px solid;}
    }
    &.greenNoteTable{
      td{
        text-align: left;
        line-height: 24px !important;
        height: auto !important;
        border: 1px solid $c-f;
      }
      tr:nth-child(odd){
        td{background-color: #f6f8f9;}
      }
      tr:nth-child(even){
        td{background-color: #eceff1;}
      }
      .td1{width: 15%;text-align: center;}
      .td2{padding: 12px 20px;}
    }
    &.financeNoteTable{
      td{
        text-align: left;
        line-height: 24px !important;
        height: auto !important;
        border: 1px solid $c-f;
      }
      tr:nth-child(odd){
        td{background-color: #fff;}
      }
      tr:nth-child(even){
        td{background-color: #fafafa;}
      }
      .td1{width: 15%;text-align: center;
        color: $c-9;
      }
      .td2{padding: 12px 20px;}
    }
    &.rechargeDrawTable{
      td{line-height: 22px;}
      .td1{width: 8%;}
      .td2{width: 12%;}
      .td3{width: 30%;}
      .td4{width: 50%;padding:0 0 0 10px;
        @extend %tl;
      }
    }
    &.borderTable{
      &.text-left{
        td{text-align: left;}
      }
      td{
        border: $c-db 1px solid;
        line-height: 20px;height:auto;padding:12px 8px;
        &.percent10{
          width: 10%;
        }
        &.percent20{
          width: 20%;
        }
      }
    }
    &.zyjkTable{
      border: $c-db 1px solid;
      border-right: none;
      border-bottom: none;
      width: 97%;
      margin: 0 2em;
      thead{
        td.td4{text-align: center;}
      }
      td{
        @extend %tl;
        padding:4px 8px;
        //background-color: $c-f;
        border:$c-db 1px solid;
        border-left:none ;
        border-top:none ;
        line-height: 22px;
        &.td1{width:6%;text-align: center;}
        &.td2{width: 18%;text-align: center;}
        &.td3{width: 16%;text-align: center;}
        &.td4{width:26% ;text-align: left;}
        &.td5{width: 20%;text-align: center;}
        &.td6{width:14% ;text-align: center;}
      }
    }
  }

}
//安全保障
.topbanner{height: 376px;@extend %tc;

  .securityBannerBox{height: 376px;
    background: url("../images/banner/securitytopbanner.png") no-repeat center center;
    background-size: cover;
  }
  &.securityBanner{
    background: url("../images/banner/securitytopbanner_bg.png") repeat-x;
  }
  .securityBannerText{color: $c-f;
    overflow: hidden;
    width: 100%;
    p{margin: 0;}
    .securityBannerTextTit{font-size: 5rem;
      margin-top: 100px;
    }
    .securityBannerTextDes{font-size: 2.142rem;letter-spacing: 1px;}
  }
  &.guideBanner{//新手指引banner
    background-color: #fd7878;
    height:280px;
    color: $c-f;
    &.container{
      height: 280px;
    }
  }
}
//法人签字
.corporationSign{
  text-align: right;
  padding: 20px 40px 50px;
  .corporationSignImg{
    display: inline-block;
    width: 116px;height: 60px;
    vertical-align: middle;
    background: url("../images/about/corporationSign.png") no-repeat;
  }
}
//新手指引
.guideBanner{
  position: relative;
  .guideBanner-tit,.guideBanner-describe,.guideBanner-pic{
    position: absolute;
    left: 50%;
  }
  .guideBanner-tit{
    top:80px;
    font-size: 60px;
    margin-left: -370px;
    letter-spacing: 2px;
  }
  .guideBanner-describe{
    top:170px;
    font-size: 20px;
    margin-left: -370px;
  }
  .guideBanner-pic{
    width: 313px;
    height: 232px;
    background: url("../images/about/guide/topbanner-pic.png") no-repeat;
    bottom: 0;
    margin-left: 70px;
  }
}
.guideBody{
  padding: 68px 0;
  background-color: $c-f;
  @extend %tc;
  &.guide-body1{
    dl.select-reasonDl{
      margin-top: 54px;
      @extend %fl;
      width: 33.33%;
      @extend %tc;
      dt{
        color: $mainColor;
        font-size: 38px;
      }
      .dd1{
        margin-top: 24px;
        color: $c-3;
        font-size: 18px;
      }
      .dd2{
        margin-top: 4px;
        color: $c-6;
        font-size: 14px;
      }
    }

  }
  &.guide-body2{
    background-color: $c-f2;
    .guide-process{
      width: 880px;
      height: 130px;
      //background: red;
      margin: 64px auto 14px;
      position: relative;
    }
    .guide-processBox{
      position: absolute;
      top:0;
      width:80px;
      @extend %tc;
      &.processBox1{
        left: 0;
      }
      &.processBox2{
        left: 200px;
      }
      &.processBox3{
        left: 400px;
      }
      &.processBox4{
        left: 600px;
      }
      &.processBox5{
        left: 800px;
      }
      .guide-processBoxText{
        color: $c-6;
        font-size: 18px;
        margin-top: 24px;
      }
    }
    .guide-process-icon{//投资流程图标
      width: 80px;
      height: 80px;
      display: block;
      background: url("../images/about/guide/guide-process-icon.png") -9999px -9999px no-repeat;
      background-position-x: 0;
      @for $i from 0 to 5{
        &.icon-#{$i+1}{
          background-position-y:-$i*80px;
        }
      }
      &.icon-arrowRigth{
        width: 16px;
        height: 20px;
        background-position-y:-410px;
        position: absolute;
        top:50%;
        margin-top: -34px;
        &.arrowrigth-1{left: 130px;}
        &.arrowrigth-2{left: 330px;}
        &.arrowrigth-3{left: 530px;}
        &.arrowrigth-4{left: 730px;}
      }
    }
  }
  &.guide-body3{
    .guide-body-run{//爱康金服如何运作？
      position: relative;
      margin-top:70px ;
      width: 998px;
      height: 364px;
      background: url("../images/about/guide/run2.png") no-repeat;
      .guide-body-runs{//每个标签喽
        width: 152px;
        height: 60px;
        line-height: 60px;
        background-color: #e6e6e6;
        text-align: center;
        position: absolute;
        font-size: 16px;
        color: $c-6;
        transition:all 0.5s;
        &:hover{
          background-color: $mainColor;
          color: $c-f;
          .run-logo{
            background-image: url("../images/about/guide/logo-white.png");
          }
        }
        &.run-1{
          top:0;
          left: 50%;
          margin-left: 42px;
        }
        &.run-2,&.run-3,&.run-4,&.run-5{
          top:50%;
          margin-top: -34px;
        }
        &.run-2{
          left: 0;
        }
        &.run-3{left: 270px;}
        &.run-4{left: 540px;}
        &.run-5{left: 856px;}
        &.run-6{
          bottom: 0;
          left: 50%;
          margin-left: -62px;
        }
        .run-logo{
          width: 113px;
          height: 32px;
          background: url("../images/about/guide/logo-grey.png") no-repeat;
          position: absolute;
          top:50%;left: 50%;
          margin-top: -16px;
          margin-left: -56px;
        }
      }
    }
  }
  &.guide-body4{
    background-color: $c-f2;
    padding: 54px 0 50px 0;
    .btn{width: 260px;
      border-radius: 2px;
    }
  }
  .guide-body-tit{
    color: $c-9;
    font-size: 34px;
    font-weight: lighter;
  }
  .guide-body-con{
    @extend %clearfix;
  }

}

.about-security{
  &.bg-grey{background-color: $c-f2;}
  background-color: $c-f;
  .container{width: 930px;}
  .about-securityBody{
    @extend %clearfix;
    padding-bottom: 60px;
  }
  dl.securityConDl{
    margin-top: 100px;
    width: 440px;
    font-size: 1rem;
    color: $c-6;
    dt{font-size: 2.57rem;color: $c-3;}
    dd{margin-top: 14px;line-height: 24px;}
  }
  .icon230{
    display: block;
    width: 230px;
    height: 230px;
    margin-top: 60px;
    background: url("../images/about/icon230.png") no-repeat;
    @for $i from 0 through 3 {
      &.icon-security#{$i+1}{
        background-position-x: 0;
        background-position-y: -$i*230 +(-$i*10px);
      }
    }
    &.icon-security1{}
    &.icon-security2{}
    &.icon-security3{}
  }

}
.reminder-box{//温馨提示
  margin:0 30px;
  padding-top: 26px;
  color: $c-9;
  line-height: 24px;
  .reminder-tit{
    font-size: 1rem;
    color: $c-6;
    margin-bottom:4px;
  }
  p{font-size: 0.857rem;}
}
//页面将在5秒钟后关闭
.colse-5seconds{
  margin: 20px 0 ;
  .colse-5seconds-body{
    padding: 100px 0 140px 0;
    background-color: $c-f;
    .describe-icon{margin-bottom: 0;font-size: 20px;}
    .describe-icon2{color: $c-6;margin:10px 0 0 0;}
    .describe-icon3{margin-top: 10px;color: $c-6;font-size: 14px;}
    .btn{margin-top: 30px;}
  }
}
//正在跳转第三方
.redirect{
  .redirectTit{height: 80px;}
  .redirectBody{
    overflow: hidden;
    position: relative;
    @extend %tc;
    height: 500px;
    background-color: $c-f;
    .redirectBodyImg{width: 50px;height: 54px;
      margin: 160px auto 30px;
      background: url("../images/loading2.gif") no-repeat;
    }
    .redirectBody-con{color: $c-6;

    }
  }
}
//弹层
.popup-mask{
  display: none;
  width: 100%;
  height: 100%;
  position: fixed;
  top:0;left: 0;
  background-color: $c-6;
  opacity: .3;
  filter: alpha(opacity=30);
  z-index: 99;
}
.popup{
  display: none;
  /*position: fixed;
  top:50%;margin-top: -145px;*/
  position: absolute;
  top:120px;
  z-index: 100;
  width: 490px;
  padding-bottom: 50px;
  left: 50%;
  margin-left: -245px;
  background-color: $c-f;
  &.smallPopup{
    position: fixed;
    top:50%;
    transform: translateY(-50%);
    margin-top: -212.5px\9;
  }
  .popup-tit{height: 55px;line-height: 65px;
    border-bottom: $c-f1 1px solid;
    text-indent: 20px;
    font-size: 1.29rem;
    color: $c-3;
    position: relative;
    .icon-colseBox{
      display: block;
      width: 55px;height: 55px;
      position: absolute;
      top:0;right: 0;
      cursor: pointer;
    }
    .icon-colse{
      position: absolute;
      top:20px;right: 15px;
    }
  }
  .popup-bodyText{
    margin: 30px 25px 0px 25px;
    @extend %tc;font-size: 1rem;
    color: $c-3;line-height: 1.8rem;
    .suceess-box{
      //background-color: red;
      .describe-icon{
        margin:10px 0 10px;
      }
    }
    &.text-left{@extend %tl;}
  }
  /*&.popup-activityUEFAEuro2016{//欧洲杯活动弹层确认
    //margin-top: -180px;
  }*/
  .multRecordBox-tit{//欧洲杯活动弹层确认
    background-color: $c-f1;
    @extend %clearfix;
    line-height: 36px;
  }
  .multRecordBox-con{//欧洲杯活动弹层确认
    overflow: hidden;
    padding-bottom: 30px;
    .multRecordBox-con-row{
      @extend %clearfix;
      line-height: 40px;
    }
  }
  table.popup-activityTable{
    margin: -10px auto 10px;
    @extend %tl;
    width: 530px;
    color: $c-3;
    font-size: 14px;
    line-height: 2.6rem;
    td{
      vertical-align: top;
      //padding: 5px 0;
      &.th1{font-size: 18px;color: $c-3;}
      &.td1{width: 130px;color: $c-9;
        text-align: right;
      }
      &.td2{width:390px;color: $c-6;padding-left: 20px;}
      &.tdtjm{//员工推荐码
        padding-bottom: 6px;
        .input{
          width: 185px;

        }
        span.error{@extend %dis-inlineblock;margin-left: 6px;white-space: nowrap;}
      }
      &.tdAgreement{//协议部分喽
        line-height: 22px;
        padding-bottom: 10px;
        color: $c-9;
        .error{padding-bottom: 10px;}
      }
    }
  }
  table.popup-activityTableN{
    //散标的购买弹层表格咯
    margin: -10px auto 10px;
    @extend %tl;
    width: 530px;
    color: $c-3;
    font-size: 14px;
    line-height: 2.6rem;
    td{
      vertical-align: top;
      &.td1{
        width: 70px;
        text-align: right;
      }
      &.td2{width: 220px;}
      &.td3{
        width: 70px;
        height: 40px;
        text-align: right;
      }
      &.td2,&.td4,&.td2Box{padding-left: 20px;}
      &.td4Box{
        text-indent: 26px;
        label{
          color:$c-6;
        }
        a{color:inherit;}
      }
      &.tdBtnBox{
        padding-top:30px ;
        text-align: center;
      }
      &.tdtjm{//员工推荐码
        padding-bottom: 6px;
        .input{
          width: 185px;
        }
        span.error{@extend %dis-inlineblock;margin-left: 6px;white-space: nowrap;}
      }
      .interestRateBuyPopup-TableBox{
        .interestRateBuyPopup-notCon{
          input.noValue{
            width: 400px;
            padding: 0 5px;
            height: 33px;
            line-height: 33px;
            border-radius:4px ;
            border:1px solid #dbdbdb;
            outline: none;
            display: block;
            color:$c-6;
            text-indent: 8px;
          }
        }
        .interestRateBuyPopup-Con{
          //display: none;
          .selectBox{
            width: 400px;
            padding: 0 5px;height: 33px;line-height:33px;
            border-color:$c-db;
            border-radius:4px ;
            display: block;
            input{
              height:31px;line-height: 31px;
            }
            ul.select_ul{
              top:30px;
              li{height: auto;
                line-height: normal;
                position: relative;
                border-bottom: none;
                padding:11px 0;
                color:$c-6;
                &:hover{
                  background-color: #fafafa;
                }
                .select_ul_li_text,.select_ul_li_text_desc{
                  height: 25px;line-height: 25px;
                }
                &::after{
                  position: absolute;
                  content: '';
                  width: 94%;
                  height:1px;
                  background-color: $c-db;
                  bottom:0;
                  left:3%;
                }
                &.select_ul_li_footer{
                  &::after{
                    width: 100%;
                    left:0;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
  .up-infoPrompt{
    color: $mainColor;
    @extend %tl;
    line-height: 30px;
    height: 30px;
    text-indent: 10px;
  }
  .popup-bodyBtn{
    margin-top: 32px;
    &.martop0{margin-top: 0;}
    @extend %tc;
    .btn{font-size: 1rem;
      width: 105px;height: 34px;line-height: 34px;
      margin: 0 10px;
    }
  }
  &.popup-interestRate{//个人中心兑换券码弹层
    width: 650px;
    margin-left: -325px;
    //margin-top: -241px;
    padding-bottom: 0;
  }
}
//问答
.askAnswer-popup{
  margin:0 16px;
  .askAnswer-popup-tit{height: 56px;line-height: 22px;}
  ul.askAnswerUl{
    li{height: 40px;
      input{margin-right: 8px;}
    }
  }
}
//产品详情页点击看大图弹层
.note-popup{
  width: auto;
  height: auto;
  position: fixed;
  left: 50%;top:50%;
  margin-left: -285px;
  margin-top: -145px;
  background: url("../images/loading.gif") no-repeat center center $c-f;
  padding: 0;
  .icon-colse{
    position: absolute;
    top:15px;
    right: 15px;
    z-index: 2;
  }
  img{display: block;}
  .note-popup-btn{
    width: 40%;
    height: 100%;
    position: absolute;
    top:0;
    cursor: pointer;
    z-index: 1;
    background: url("../images/opacity.png") repeat left top;
    &:hover{
      .prevNext-btn{display: block;}
    }
    .prevNext-btn{
      display: none;
      width: 33px;
      height: 60px;
      position: absolute;
      top:50%;
      left: 50%;
      margin-top: -30px ;
      background: url("../images/arr2.png") no-repeat;
    }
    &.disabled{
      cursor: default;
      .prevNext-btn{display: none;}
    }
    &.note-popup-next-btn{
      right: 0;
      .prevNext-btn{
        margin-right: -15px;
        background-position: -37px 0;
      }
    }
    &.note-popup-prev-btn{
      left: 0;
      .prevNext-btn{
        margin-left: -15px;
        background-position: 0 0;
      }
    }
  }
}
//模拟文件上传样式呢
.input-append{
  @extend %clearfix;
  margin: 0 10px;
  height: 34px;
  position: relative;
  //background-color: $c-3;
  .input-large{
    @extend %tl;
    @extend %fl;
    width: 77.2%;
    *width:69%;
    padding: 0;
    height: 32px;
    line-height: 32px;
    border: $c-f1 1px solid;
    border-right: none;
  }
  a.btn{
    @extend %fr;
    border-radius: 0;
    height: 32px;
    line-height: 32px;
    font-size: 1rem;
    width: 22%;
    background-color: $mainColor;
    border: $mainColor 1px solid;
    position: relative;
    overflow: hidden;
    span{
      position: absolute;
      top:0;left: 0;
      z-index: 1;
      width: 100%;
      text-align: center;
    }
    #lefile{
      filter: alpha( opacity=0) ;
      opacity: 0;
      position: absolute;
      top:0;left: 0;
      width: 100%;
      height:32px ;
      font-size: 100px;
      z-index: 2;
    }

  }
  .simulation-real{
    width: 100%;
    height: 34px;
    position: absolute;
    top:0;
    left: 0;
  }
}
//错误页面404/505
.error-page{@extend %tc;
  width: 550px;
  margin-left: -275px;
  margin-top: -200px;
  position: fixed;
  top:50%;left: 50%;
  .error-pagePic{height: 215px;}
  .error-pageTit{font-size: 3rem;height: 100px;line-height: 100px;color: $c-6;}
  .btn.btn-line{font-size: 1.14rem;height: 40px;line-height: 40px;}
}

//灵活宝协议相关页面里的协议链接
.greenAgreementA{
  color:$mainColor;
  &:active,&:visited{color:$mainColor;}
  &:hover{
    color: $mainColor;
    text-decoration: underline;
  }
}
//协议页面
.agreement{padding-bottom: 80px;
  .agreementTit{@extend %clearfix;padding-bottom: 16px;}
  .agreementCon{
    background-color: $c-f;
    padding: 40px 50px;
    ul.agreementConTitUl{
      @extend %clearfix;
      width: 100%;
      height: 46px;
      line-height: 46px;
      border-bottom: $c-db 1px solid;
      li{
        @extend %fl;
        font-size: 18px;
        padding: 0 5px;
        height: 45px;
        margin-right: 85px;
        cursor: pointer;
        //border-bottom: 1px solid transparent;
        &.active{
          border-bottom: 2px solid $mainColor;
        }
      }
    }
  }
  .agreementConBody{
    padding:6px 0 50px 0;
    @extend %clearfix;
    .greenAgreementA{
      color:$c-3;
      font-weight: bold;
    }
    //font-family: '宋体';
    .item{display: none;
      &.active{
        display: block;
      }
    }
    p{
      margin-top: 20px;
      font-size: 14px;
      line-height: 28px;
      color: $c-3;
      text-indent: 2em;
      strong{font-weight: bold;}
      &.no-textIndent{
        text-indent: 0em;
      }
      &.tit{
        text-indent: 0em;
        margin-bottom: -15px;
        font-size: 15px;
        color: $c-3;
        font-weight: bold;
      }
      &.textIndentOaTable{
        //text-indent: 0em;
        line-height: 0;padding-top: 10px;
      }
      &.bold{
        font-weight: bold;
      }
    }
  }
}
//右侧客服及点击回到顶部
.rightDownSlide{
  @keyframes rightDownSlideAnimate {
    0%{
      top: -100%;
    }
    100%{
      top: 100%;
      margin-top: -210px;
    }
  }
  &.active{
    animation:rightDownSlideAnimate 1s;
    //animation-delay:0.5s;
    top: 100%;
    margin-top: -210px;
  }
  //transition: all 1s;
  //transition-timing-function: cubic-bezier(0,0,0.8,1);
  width: 53px;
  position: fixed;
  //height: 89px;
  //background-color: $c-f;
  left: 50%;
  margin-left:600px;
  top:-100%;
  z-index: 10;
  @extend %tc;
  .customer-service,.arrowtop,.weixinEwm,.qaPrize{
    display: block;
    width: 100%;
    height: 44px;
    line-height: 44px;
    background-color: $c-f;
    .icon-qaPrize{
      display: inline-block;
      vertical-align:middle;
      cursor: pointer;
      width: 32px;
      height:32px;
      background: url("../images/icon/qaPrize.png") 0 0 no-repeat;
    }
    &:hover{
      background-color: $mainColor;
      .icon-qaPrize{
        background-position:0 -32px;
      }
      .icon32{
        &.icon-customer-service{
          background-position: -42px -294px;
        }
        &.icon-arrowtop{
          background-position:-42px -252px;
        }
        &.icon-ewm{
          background-position: 0 -546px;
        }
      }
      @keyframes customer-serviceAnimant {
        0%{
          width: 0;
          opacity: 0;
          filter: alpha(opacity=0);
        }
        100%{
          width: 140px;
          opacity: 1;
          filter: alpha(opacity=100);
        }
      }
      .customer-serviceBox{
        animation: customer-serviceAnimant 0.1s;
        display: block;
        opacity: 1;
        filter: alpha(opacity=100);
      }
      @keyframes weixinEwmBoxAnimate {
        0%{
          right: 0;
          opacity: 0;
          filter: alpha(opacity=0);
        }
        100%{
          right: 63px;
          opacity: 1;
          filter: alpha(opacity=100);
        }
      }
      .weixinEwmBox{
        display: block;
        right: 63px;
        animation: weixinEwmBoxAnimate 0.5s;
        opacity: 1;
        filter: alpha(opacity=100);
      }
    }
    .customer-serviceBox{//ＱＱ客服
      display: none;
      height: 44px;
      background-color: $mainColor;
      padding: 0 0 0 5px;
      width: 144px;
      overflow: hidden;
      position: absolute;
      bottom:45px;
      right: 53px;
      a{
        @extend %fl;
        padding: 0 5px;
        color: $c-f;
      }
    }
    .weixinEwmBox{//弹出的微信二维码
      display: none;
      height: 138px;
      width: 120px;
      background-color: $c-f;
      position: absolute;
      bottom:88px;
      right: 63px;
      box-shadow: 1px 1px 3px $c-db;
      &:after{
        display: block;
        content: '';
        border-width:10px 0 0 10px;
        border-style:solid;
        border-color:transparent;/*透明 灰 透明 透明 */
        border-left-color:$c-f ;
        position: absolute;
        bottom: 0px;
        right:-10px;
      }
      img{
        display: block;
        width: 110px;
        height: 110px;
        margin:5px auto 0;
      }
      .weixinEwmBox-text{
        position: absolute;
        bottom: 6px;left: 0;
        width: 100%;
        @extend %tc;
        font-size: 12px;
        line-height: 20px;
        color: $mainColor;
      }
    }
  }
  .arrowtop{
    cursor: pointer;
    //display: none;
  }
  .qaPrize{
    border-bottom: $c-ea 1px solid;
  }
  .customer-service{
    border-bottom: $c-ea 1px solid;
    border-top: $c-ea 1px solid;
  }
  .icon32{margin-right: 0;
    *margin-top:6px;
    &.icon-customer-service{
      background-position: 0 -294px;
    }
    &.icon-arrowtop{
      background-position:0 -252px;
    }
    &.icon-ewm{
      background-position:-42px -504px;
    }
  }

}
//运营报告
.operationReporyBox{
  font-family: "Adobe Fan Heiti Std B","Heiti";
  .operationReporyPage{
    background-color: #efefef;
    .container{
      overflow: hidden;
    }
    .reporyPage2UlIcon{
      text-align: center;
      display: block;
      width: 119px;
      height: 132px;
      background: url("../images/about/operationReport/reportDatil-top2-icon.png") no-repeat;
      position: absolute;
      top:0;left: 0;
      &.icon-1{
        background-position: 0 -2px;
      }
      &.icon-2{
        background-position: 0 -147px;
      }
      &.icon-3{
        background-position: 0 -292px;
      }
      &.icon-4{
        background-position: 0 -437px;
      }
    }
    .reporyPage2UlIcon2{
      text-align: center;
      display: block;
      width: 107px;
      height: 107px;
      background: url("../images/about/operationReport/reportDatil-top2-icon2.png") no-repeat;
      position: absolute;
      top:0;left: 0;
      &.icon-1{
        background-position: 0 0;
      }
      &.icon-2{
        background-position: 0 -107px;
      }
      &.icon-3{
        background-position: 0 -214px;
      }
      &.icon-4{
        background-position: 0 -321px;
      }
      &.icon-5{
        background-position: 0 -428px;
      }
      &.icon-6{
        background-position: 0 -535px;
      }
    }
    &.page1{
      //background-color: $c-f;
      .repory-con{
        margin: 90px 0 60px 0;
      }
      .repory-tit{
        position: absolute;
        font-size: 54px;
        color: #459bcf;
        top:43%;right:0;
      }
      .repory-time{
        position: absolute;
        font-size: 40px;
        color:$c-6;
        top:61%;
        right: 0;
      }
    }
    &.page2{
      color:$c-f;
      background:url("../images/about/operationReport/con-bg1.png") center center #6fbae9 no-repeat;
      background-size: cover;
      padding-bottom: 60px;
      .repory-tit1{font-size: 34px;height: 60px;margin-top: 60px;
        position: relative;
        &:after,&:before{
          position: absolute;
          top: 50%;
          width: 40%;
          height: 1px;
          background-color: #fff;
          opacity: 0.5;
          display: block;
          content: '';
          z-index: 1;
        }
        &:after{
          left: 0;
        }
        &:before{
          right: 0;
        }
      }
      .repory-tit2{font-size: 44px;}
    }

    ul.reporyPage2Ul{
      overflow: hidden;
      width: 100%;
      text-align: left;
      li{
        margin-top: 43px;
        height: 132px;
        position: relative;
        margin-left: 60px;
        width: 480px;
        float: left;
        //background-color: red;
        .reporyPage2Ul-conBox{
          margin: 27px 0 0 140px;
        }
        .reporyPage2Ul-tit{
          height: 26px;
        }
        .reporyPage2Ul-con{
          font-size: 40px;
          em{font-size: 14px;}
        }
        .reporyPage2Ul-conBox2{
          margin: -10px 0 0 140px;
          .reporyPage2Ul-tit{font-size: 30px;}
          .reporyPage2Ul-con{font-size: 50px;}
        }
      }
    }
    .page3-top1{
      margin-top: 70px;
      text-align: center;
      img{display: inline-block;}
    }
    &.page3{
      background-color: #fafafa;
      .jdBorder{
        margin-top:60px;
        border: 1px solid $c-db;
        //padding: 30px 0;
        border-bottom: 0;
      }

      .page3-top1-desc{
        font-size: 18px;
        line-height: 36px;
        padding: 40px 0 60px 0;
        color: $c-6;
      }
      .page3-top2-text{
        padding: 26px 0;
        color: $c-6;
        font-size: 20px;
        line-height: 40px;
        border-top:1px solid $c-db;
        border-bottom:1px solid $c-db;
        .blue{
          font-size: 36px;
        }
      }
      .blue{
        color: #4aa4dc;
      }
      ul.reporyPageIconUl{
        text-align: left;
        overflow: hidden;
        width: 100%;
        margin: 0;
        li{
          overflow: hidden;
          width: 49%;
          float: left;
          margin-top: 60px;
          .reporyPageIconUl-conBox{
            color: $c-6;
            margin-left: 30px;
            overflow: hidden;
            float: left;
            .reporyPageIconUl-tit{
              font-size: 26px;
              margin-top: 24px;
              height: 48px;line-height: 48px;
            }
            .reporyPageIconUl-con{
              font-size: 90px;
              height: 90px;line-height: 90px;
              em{font-size: 30px;}
            }
          }
        }
      }
      .page3-titBox{
        margin-top: 120px;
        height: 44px;
        position: relative;
        overflow: hidden;
        text-align: center;
        &:after{
          position: absolute;
          top:50%;left: 0;
          width: 100%;
          height: 1px;
          background-color: $c-db;
          display: block;
          content: '';
          z-index: 1;
        }
        .page3-tit{
          color: #42b3de;
          font-size: 30px;
          background-color: #fafafa;
          display: inline-block;
          position: relative;
          top:50%;
          margin-top: -22px;
          z-index: 2;
          height: 44px;line-height: 44px;
          padding: 0 20px;
          span{
            font-size: 45px;
          }
        }
      }
      .reporyPage3Icon{
        background: url("../images/about/operationReport/reportDatil-page3-icon.png") no-repeat;
        display: block;
        &.icon-1,&.icon-2,&.icon-1b,&.icon-2b{
          width: 199px;
          height: 199px;
          float: left;
          margin-left: 10%;
        }
        &.icon-1{
          background-position: 0 0;
        }
        &.icon-2{
          background-position: -200px 0;
        }
        &.icon-1b{
          background-position: 0 -550px;
        }
        &.icon-2b{
          background-position: -200px -550px;
        }
        &.icon-3,&.icon-4,&.icon-5{
          width: 108px;
          height: 92px;
        }
        &.icon-3{
          background-position: 0 -425px;
        }
        &.icon-4{
          background-position: -173px -425px;
        }
        &.icon-5{
          background-position: -350px -425px;
        }
        &.icon-6,&.icon-7{
          width: 161px;
          height: 161px;
          float: left;
          margin-left: 10%;
        }
        &.icon-6{
          background-position: -400px 0;
        }
        &.icon-7{
          background-position:-570px 0;
        }
      }
      .page3-top4{
        height: 500px;
        margin-top: 40px;
      }
      .page3-top5{
        text-align: left;
        //margin: 0 60px;
        overflow: hidden;
        .page3-top5-people{
          height: 135px;
          margin: 60px 0 170px;
          position: relative;
          .people-man,.people-woman{
            float: left;
            width: 70px;
            height: 135px;
            margin-right: 35px;
            background: url("../images/about/operationReport/reportDatil-page3-icon.png") no-repeat;
          }
          .people-woman{
            background-position:0 -241px;
          }
          .people-man{
            background-position:-105px -241px;
          }
          .people-womanBox,.people-manBox{
            color:$c-f;
            font-size: 28px;
            text-align: center;
            width: 109px;
            height: 96px;line-height: 96px;
            position: absolute;
            background: url("../images/about/operationReport/reportDatil-page3-icon.png") no-repeat;
          }
          .people-womanBox{
            bottom:-116px;
            left: 0;
            background-position:-190px -269px;
          }
          .people-manBox{
            top:-110px;
            right: 60px;
            background-position:-360px -261px;
          }
        }
      }
      .page3-top5TitBox{
        margin-top: 60px;
        position: relative;
        padding-left:30px;
        height: 75px;
        overflow: hidden;
        &:after{
          display: block;
          content: '';
          width: 12px;
          height: 75px;
          background-color:#4aa4dc;
          position: absolute;
          top:0;left: 0;
        }
        .page3-top5-titDesc{color:#4aa4dc;height: 30px;line-height: 30px;margin-top: 4px;}
        .page3-top5-tit{font-size: 30px;color:$c-6;}
      }
      .page3-top5JBox{
        overflow: hidden;
        margin-top: 50px;
        color:#4aa4dc;
        .page3-top5J-right-row{
          overflow: hidden;
          height: 145px;
          .reporyPage3Icon{
            margin: 30px 0 0 60px;
          }
          .page3-top5JConBox{
            margin: 25px 0 0 20px;
          }
        }
        .reporyPage3Icon,.page3-top5JConBox{
          float: left;
        }
        .reporyPage3Icon{
          margin-right: 20px;
        }
        .page3-top5JCon-text1{
          font-size: 48px;
          height: 54px;
        }
        .page3-top5JCon-text2{
          font-size: 20px;
        }
      }
      .page3-top5J-left,.page3-top5J-right-row{
        background-color: $c-f5;
      }
      .page3-top5J-left{
        width: 530px;
        height: 300px;
        float: left;
        margin-right: 10px;
        .reporyPage3Icon{
          margin: 85px 0 0 90px;
        }
        .page3-top5JConBox{
          margin-top: 85px;
        }
      }
      .page3-top5J-right{
        float: left;
        width: 510px;
      }
      .page3-top6{
        padding-bottom:150px;
        ul.reporyPageIconUl li{
          width: 44%;
          margin-left: 60px;
          .reporyPage3Icon{margin-left: 0;}
        }
      }
    }
    &.page4{
      background-color: #dfdfdf;
      text-align: center;
      img{display:inline-block;}
    }

    .repory-con{
      text-align: center;
      position: relative;
    }
  }
}
.bg-white{background-color: $c-f;}
//活动页面
.activity{
  &.activity-tycoon{
    //合伙人
    background: url("../images/activity/tycoon/skyBg.jpg") repeat #261358;
    img{
      display: block;
      width: 100%;
    }
    .topPic{
      width: 100%;
      height:1900px;
      background: url("../images/activity/tycoon/topPic2.jpg") center center no-repeat;
      margin: auto;
      position: relative;
      .titBox{
        position: absolute;
        bottom:860px;
        left:50%;
        margin-left: -460px;
      }

    }
    .titBox{
      width: 921px;
      height: 85px;
      line-height: 85px;
      color: #fff;
      background: url("../images/activity/tycoon/titiBg.png") no-repeat;
      text-align: center;
      letter-spacing:10px;
      font-size: 56px;
      margin: 100px auto 0;

    }
    .tycoonBody{
      overflow: hidden;
      margin-top: -760px;
      .tycoonConten{
        width: 1106px;
        margin: auto;
        position: relative;
        .inputBox{
          position: absolute;
          width: 272px;
          right:222px;bottom:505px;
          overflow: hidden;
        }
        .tycoonInput{
          width: 266px;
          height: 70px;
          border: 2px solid #333;
          border-radius:10px ;
          margin-top: 20px;
          text-align:center;
          font-size: 44px;
          &.input3{
            background: #ffef00;
            color:#e40012;
          }
        }
      }
      .ewmBox{
        width: 538px;
        height:537px;
        margin: 80px auto 110px;
      }
      .gzBox{
        width: 1027px;
        margin:40px auto 90px;
      }
    }
  }
  &.bankCustody{
    //银行存管宣传页
    .bankCustody-banner{
      width: 100%;height: 590px;
      background: url("../images/activity/bankCustody/bankCustodyBig-bannerBg.jpg") center center no-repeat;
      background-size: cover;
      position: relative;
      &:after{
        width: 732px;
        height: 273px;
        background: url("../images/activity/bankCustody/bankCustodyBig-bannerText.png") center center no-repeat;
        position: absolute;
        content: '';
        display: block;
        top:50%;left: 50%;
        margin: -85px 0 0 -366px;
      }
    }
    .bankCustody-body{
      text-align: center;
      .bankCustody-body-tit{
        font-size: 40px;
        color:$c-3;
        padding: 70px 0;
      }
      .bankCustody-small-tit{
        font-size: 30px;
        color: $c-3;
        height: 60px;
      }
      .bankCustody-small-text{
        font-size: 16px;
        color: $c-6;
        line-height: 30px;
      }
      .page1,.page2,.page3,.page4{overflow: hidden;}
      .page1-img{
        margin: auto;
      }
      .page1-text{
        margin:40px auto 60px;
        text-align: left;
        width: 910px;
        font-size: 16px;
        color:$c-6;
        line-height: 26px;
        text-align: left;
        text-align:justify;
      }
      .bankCustody-icon{
        width: 224px;height: 224px;
        background: url('../images/activity/bankCustody/page-icon.png') -999px -999px no-repeat;
        &.icon-1{
          background-position: 0 0;
          float: left;
        }
        &.icon-2{
          background-position: 0 -224px;
          float: right;
        }
        &.icon-3{
          background-position: 0 -448px;
          float: left;
        }
      }
      .page2-textBox,.page3-textBox,.page4-textBox{
        overflow: hidden;
        width: 970px;
        margin: auto;
        //height: 480px;
      }
      .page2{
        height: 480px;
      }
      .page2-text,.page4-text{
        margin-top: 20px;
        text-align: right;
        width: 620px;
        float: right;
      }
      .page3{
        height: 330px;
      }
      .page3-textBox{
        margin-top: 50px;
      }
      .page3-text{
        margin-top: 60px;
        width: 620px;
        float: left;
        text-align: left;

      }
      .page4{
        height: 350px;
      }
      .page4-textBox{
        margin-top: 70px;
      }
      .page4-text{
        margin-top: 50px;
      }
    }

  }
  &.akfl{
    background-color: #fdb020;
    .akfl-banner{
      background-color: #fec61c;
      height: 512px;
      position: relative;
      .akfl-banner-bg1,.akfl-banner-bg2,.akfl-banner-bg3,.akfl-banner-bg4,
      .akfl-banner-body,.akfl-banner-money1,.akfl-banner-money2,
      .akfl-banner-money3,.akfl-banner-money4,.akfl-banner-money5,.akfl-banner-money6{
        position: absolute;
      }
      .akfl-banner-bg1{
        background: url("../images/activity/akfl/akfl-banner-bg1.png") no-repeat;
        width: 1700px;
        height: 439px;
        top:0;
        left: 50%;
        margin-left: -840px;
        z-index: 1;
      }
      .akfl-banner-bg2{
        background: url("../images/activity/akfl/akfl-banner-bg2.png") repeat-x;
        width: 100%;
        height: 268px;
        bottom:30px;
        left: 0;
        z-index: 2;
      }
      .akfl-banner-bg3{
        background: url("../images/activity/akfl/akfl-banner-bg3.png") repeat-x;
        width: 100%;
        height: 145px;
        bottom:0;
        left: 0;
        z-index:3;
      }
      .akfl-banner-body{//这里是主要的图喽
        width: 858px;
        height: 412px;
        background: url("../images/activity/akfl/akfl-banner-body.png") no-repeat;
        bottom:10px;
        left: 50%;
        margin-left: -400px;
        z-index: 4;
      }
      .akfl-banner-money1,.akfl-banner-money2,
      .akfl-banner-money3,.akfl-banner-money4,
      .akfl-banner-money5,.akfl-banner-money6{
        z-index: 5;
      }
      .akfl-banner-money1{
        width: 44px;
        height: 40px;
        background: url("../images/activity/akfl/akfl-banner-money1.png") no-repeat;
        top:106px;
        left: 50%;
        margin-left: 250px;
      }
      .akfl-banner-money2{
        width: 50px;
        height: 40px;
        background: url("../images/activity/akfl/akfl-banner-money2.png") no-repeat;
        top:438px;
        left: 50%;
        margin-left: 240px;
      }
      .akfl-banner-money3{
        width: 55px;
        height: 64px;
        background: url("../images/activity/akfl/akfl-banner-money3.png") no-repeat;
        top:336px;
        left: 50%;
        margin-left: -532px;
      }
      .akfl-banner-money4{
        width: 63px;
        height: 52px;
        background: url("../images/activity/akfl/akfl-banner-money4.png") no-repeat;
        top:456px;
        left: 50%;
        margin-left: -52px;
      }
      .akfl-banner-money5{
        width: 55px;
        height: 64px;
        background: url("../images/activity/akfl/akfl-banner-money5.png") no-repeat;
        top:325px;
        left: 50%;
        margin-left: 487px;
      }
      .akfl-banner-money6{
        width: 81px;
        height: 67px;
        background: url("../images/activity/akfl/akfl-banner-money6.png") no-repeat;
        top:260px;
        left: 50%;
        margin-left: 558px;
      }
    }
    .akfl-body{
      .akfl-body-con1{
        width: 874px;
        height: 196px;
        background: url("../images/activity/akfl/akfl-body-hdjsbg.png") no-repeat;
        margin: 30px auto 0;
        position: relative;
        .akfl-body-con1-tit{
          width: 159px;
          height: 50px;
          background: url("../images/activity/akfl/akfl-body-hdjsbt.png") no-repeat;
          position: absolute;
          top:37px;
          left: 55px;
        }
        .akfl-body-con1-text{
          position: absolute;
          font-size: 17px;
          color: $c-3;
          width: 710px;
          top:90px;
          left: 77px;
          line-height: 30px;
        }
      }
      .akfl-body-con2{
        width: 880px;
        height: 220px;
        margin: 50px auto 0;
        position: relative;
        .akfl-body-con2Bg{
          background-color: $c-0;
          width: 100%;
          height: 100%;
          opacity: 0.16;
          filter: alpha(opacity=16);
          position: absolute;
          top:0;left: 0;
        }
        .akfl-body-con2Box{
          background-color: $c-f;
          height: 210px;
          width: 870px;
          position: absolute;
          top:5px;left: 5px;
        }
        .akfl-body-con2Tit{
          margin: 20px 0 0 36px;
          font-size: 14px;
          color: $c-9;
          .tit{font-size: 32px;color: $c-6;padding-right: 22px;}
        }
        .akfl-body-con2ListBox{
          margin: 20px 36px 0;
          dl.akfl-body-con2Dl1{
            width: 252px;
            color: #fd6600;
            dt.dt1{font-size: 16px;}
            dd.dd1{font-size: 60px;font-weight: 700;text-indent: -5px;}
            dd.dd2{font-size: 14px;color: $c-9;}
          }
          dl.akfl-body-con2Dl2,dl.akfl-body-con2Dl3,dl.akfl-body-con2Dl4{
            margin-top: 26px;
            width: 126px;
            font-size: 16px;
            color: $c-6;
            dd{margin-top: 6px;}
          }
          .btn{margin:28px 10px 0 0; }
        }
      }
      .akfl-body-con3{
        margin: 80px auto 0;
        padding-bottom: 100px;
        width: 880px;
        color: $c-f;
        p{font-size: 16px;
          line-height: 28px;
          &.reminder-tit{font-size: 24px;}
        }
      }
    }
  }
  &.flow{//送流量活动
    background-color: #63107e;
    overflow: hidden;
    .flow-titPic{
      @extend %tc;
      overflow: hidden;
      &.active{
        .flow-titPic1Box{display: none;}
        .flow-titPic2Box{display: block;}
      }
      .flow-titPic2Box{display: none;}
      .flow-titPic1Box{
        margin:70px auto 0;
        .flow-tit-btn{
          display: block;
          width: 417px;
          height: 57px;
          background:url("../images/activity/flow/flow-titPic1-btn.png") no-repeat;
          margin:20px auto 0;
          &:hover{
            background: url("../images/activity/flow/flow-titPic1-btnHover.png") no-repeat;
          }
        }
      }
      .flow-titPic2Box{
        margin:70px auto 0;
        position: relative;
        .flow-titPic2EWMBox{
          width: 210px;
          height: 250px;
          background-color: $c-f;
          position: absolute;
          left: 50%;margin-left: -122px;
          bottom:40px;
          .flow-titPic2EWM-tit{
            font-size:26px;line-height: 55px;
            color: $c-0;
          }
          .flow-titPic2EWM-img{
            width: 210px;
            height: 210px;
            position: absolute;bottom: 0;left: 0;
            img{width: 210px;height: 210px;}
          }
        }
      }
    }
    $flowHuang:#ffdf3e;
    color:$c-f;
    .flow-giveProcess{
      width: 940px;
      margin:auto;
      .flow-giveProcess-titIconBox{
        margin: 60px 0 0 150px;
        height: 46px;
        width: 660px;
        position: relative;
        .giveProcess-ionBgLine{
          content: '';
          position: absolute;
          top:50%;
          left: 0;
          width: 100%;
          border-bottom: $flowHuang 1px dashed;
        }
      }
      .giveProcess-iconl,.giveProcess-iconc,.giveProcess-iconr{
        width: 46px;height: 46px;
        content: '';
        position: absolute;
        top:0;
        background: url("../images/activity/flow/weixuan.png") no-repeat;
        &.active{
          background: url("../images/activity/flow/yixuan.png") no-repeat;
        }
      }
      .giveProcess-iconl{left: 0;}
      .giveProcess-iconc{left: 50%;margin-left: -23px;}
      .giveProcess-iconr{right: 0;}
      .flow-giveProcess-conBox{
        margin-top: 20px;
        @extend %clearfix;
        .giveProcess-conl,.giveProcess-conc,.giveProcess-conr{
          width: 33%;
          @extend %fl;
        }
        a{color: $flowHuang;margin-left: 8px;}
        .giveProcess-conText{font-size: 20px;}
        .giveProcess-conPic{
          margin-top: 36px;
          @extend %tc;
        }
        .giveProcess-conl{
          .giveProcess-conText{padding-left: 72px;}
        }
        .giveProcess-conc{
          .giveProcess-conText{padding-left: 28px;}
        }
        .giveProcess-conr{
          .giveProcess-conText{padding-left: 65px;}
        }
      }
      .flow-giveProcess-footer{
        color: $flowHuang;
        font-size: 22px;
        margin-top: 50px;
        padding-left: 220px;
      }
    }
    .flowRegBox,.statisticBox{display: none;}
    .flowRegLoginAround{
      .flowRegBox{display: block;}
      .statisticBox{display: none;}
      &.active{
        .flowRegBox{display: none;}
        .statisticBox{display: block;}
      }
    }
    .flowRegBox{
      width: 860px;
      margin:60px auto 0;
      //height: 370px;
      @extend %clearfix;
      .flowReg{
        width: 418px;
        @extend %fl;
        .flowReg-row{
          position: relative;
        }
        .flowReg-agreement{
          input{
            width: 16px;height: 16px;
            display: inline-block;
            vertical-align: middle;
          }
          a{color: $flowHuang;}
        }
        .flowReg-loginBox{
          @extend %tc;
          margin-top: 24px;
        }
        .flowReg-login{
          font-size: 16px;
          color: $flowHuang;
          text-decoration: underline;
        }
        .flowReg-btnBox{
          margin-top: 20px;
          @extend %tc;
          padding: 12px 0;
          width: 414px;
          border-radius: 10px;
          img{display: inline-block;}
          background-color: #ffd144;
          box-shadow: 0 8px 0 0 #d6aa20 ;
          cursor: pointer;
        }
        .flowRegInput{
          width: 386px;
          height: 20px;
          line-height: 20px;
          font-size: 16px;
          padding: 12px 15px 12px 10px;
          border: 1px solid #c19fcb;
          overflow: hidden;
          background-color: transparent;
        }
        .yzm{right: 11px;top:7px;width: 90px;height: 32px;}
        .error{
          color: #f92121;font-size: 14px;
          padding: 5px 10px;
        }
        .btn-yzm{
          position: absolute;
          top:8px;right: 10px;
          width: auto;
          height: 30px;line-height: 30px;
          padding: 0 10px;
          background-color: #f2c62c;
          border: none;
          color: $c-3;
          font-size: 14px;
        }
      }
      .flowRegRight{
        @extend %fr;
        margin-top: 70px;
      }
    }
    .flow-tableBox{
      width: 860px;
      margin: auto;
      @extend %tc;
      border: 2px solid #7d3894;
      border-radius: 10px;
      .flow-tableBox-con{
        max-height: 248px;
        overflow-x: hidden;
        overflow-y: auto;
      }
      .noflow-tableBox{
        height: 62px;line-height: 62px;
        font-size: 22px;
      }
      table.flowTable{
        width: 100%;
        thead{color: $flowHuang;font-size: 24px;
          background-color: #6d198f;
          border-bottom: 2px solid #7d3894;
        }
        tbody{font-size: 22px;
        }
        td{height: 62px;line-height: 62px;width: 25%;}
        .trTd1,.trTd3{
          background-color: #6f1e89;
        }
        .trTd2,.trTd4{
          background-color: #793291;
        }
        .trTdRow4{
          background-color: #6d1889;
          border-left:2px solid #7d3894 ;
          border-right:2px solid #7d3894 ;
        }
      }
    }
    .flow-shareTitBox {
      position: relative;
      width: 860px;
      margin: 80px auto 0;
      &:after {
        display: block;
        content: '';
        position: absolute;
        top: 50%;
        left: 0;
        height: 1px;
        margin-top: -1px;
        width: 100%;
        background-color: rgba($c-f, 0.4);
        z-index: 0;
      }
      .flow-shareTitBox-tit{
        padding: 0 0.5rem;
        width: 24%;
        margin: auto;
        text-align: center;
        background-color: #63107e;
        position: relative;
        z-index: 1;
      }
    }

    .flow-characteristic{//邀请好友、注册、投资
      margin: 80px auto 0;
      width: 90%;
      font-size: 32px;

      .col-l,.col-c,.col-r,.col-zz{
        @extend %fl;
      }
      .col-l,.col-c,.col-r{width: 28%;@extend %tl;}
      .col-zz{width: 8%;height:10px;}
      .col-r{
        @extend %fr;
      }
      .flow-characteristic-IconBox,
      .flow-characteristic-con{
        @extend %clearfix;
      }
      .flow-characteristic-con{
        margin-top:36px;
      }
      .flow-characteristic-IconBox{
      }
    }
    .flow-slogan{//标语
      width: 62%;
      margin: 100px auto 0;
      img{display: block;width: 100%;}
    }
    .flow-rule{//活动规则
      width: 820px;
      margin: 75px auto 50px;
      border: 2px solid rgba($c-f,0.3);
      border-radius: 0.875rem;
      padding: 20px;
      .flow-ruleTit{
        width: 25%;margin: 10px auto 0;

      }
      .flow-ruleCon{}
      p{font-size: 22px;
        margin-top: 20px;
        line-height:30px;
        color: $c-f;
      }
    }
  }
  &.cashback{
    background-color: #fcce30;
    .cashback-tit{//标题
      margin: auto;
      width: 318px;
      height: 86px;line-height: 86px;
      background-color: #e24433;
      border-radius: 10px;
      letter-spacing:6px ;
      font-size: 48px;
      font-weight: bold;
      color: #fffa07;
      position: relative;
      text-indent: 80px;
      .cashback-titGSPic{
        width: 184px;
        height: 160px;
        position: absolute;
        top: -15px;
        left: -92px;
        background: url("../images/activity/cashback/titLeft-Pic.png") no-repeat;
      }
    }
    .cashBtnBox{//按钮
      height: 74px;line-height: 74px;
      width: 364px;
      margin:20px auto 0;
      border-radius: 74px;
      position: relative;
      background-color: #d6aa20;
      .cashBtn{
        display: block;
        position: absolute;
        left: 0;right: 0;
        top: -10px;
        bottom: 10px;
        border-radius: 74px;
        background-color: #ffd144;
        @extend %tc;
        color: $c-3;font-weight: bold;
        font-size: 32px;
        &:hover{
          background-color: darken(#ffd144,8%);
        }
      }
    }
    .cashback-titPic{background-color:#ed5639;
      padding-bottom: 50px;
      &.active{
        .cashBtnBox{display: none;}
        .titPic2EWMBox{display: block;}
      }
      .cashback-titPicImg{margin-left: -50px;}
      .titPic2EWMBox{
        display: none;
        width: 244px;
        height: 294px;
        background-color: $c-f;
        position: relative;
        margin: auto;
        .titPic2EWM-tit{
          font-size:30px;line-height: 70px;
          color: $c-0;
          text-align: center;
        }
        .titPic2EWM-img{
          width: 244px;
          height: 244px;
          position: absolute;bottom: 0;left: 0;
          img{width: 244px;height: 244px;display: block;}
        }
      }
    }
    .cashbackCon{
      overflow: hidden;
      min-height: 100px;
      position: relative;
      .cashbackCon-titBg1,.cashbackCon-titBg2{
        height: 100px;
        position: absolute;
        top:0;
      }
      .cashbackCon-titBg1{
        left: 0;width: 100%;
        background: url("../images/activity/cashback/sunBg.jpg") repeat-x;
      }
      .cashbackCon-titBg2{
        left: 50%;width: 552px;margin-left: -276px;
        background: url("../images/activity/cashback/sun.jpg") no-repeat;
      }
      .cashback-titBox1{
        position: absolute;
        top:60px;left: 50%;
        margin-left: -150px;
        *left:0;
        *margin-left: 0;
      }
      .cashback-bodyItem1{
        margin-top: 150px;
        @extend %tc;
      }
      .cashback-rule{
        width: 972px;
        padding-bottom: 63px;
        margin:96px auto 0;
        .cashback-ruleBody-top{
          height: 60px;
          background: url("../images/activity/cashback/rule-t.png") no-repeat;
        }
        .cashback-ruleBody-footer{
          height: 60px;
          background: url("../images/activity/cashback/rule-b.png") no-repeat;
        }
        .cashback-ruleBody-con{
          position: relative;
          overflow: hidden;
          .cashback-ruleBody-left,.cashback-ruleBody-right{
            width: 40px;
            position: absolute;
            height: 100%;
            top:0;
            img{height: 100%;display: block;width: 100%;}
          }
          .cashback-ruleBody-left{
            left: 0;
          }
          .cashback-ruleBody-right{
            right:0;
          }
          .cashback-ruleBody-conText{
            margin: 0 40px;
            background-color: #faf3b7;
            overflow: hidden;
            font-size: 26px;
            font-weight: bold;
            p{
              position: relative;
              padding-left: 50px;
              span{
                display: block;
                width: 40px;height: 40px;
                line-height: 40px;
                text-align: center;
                border-radius: 44px;
                background-color: #e24433;
                color: $c-f;
                font-weight: bold;
                font-size: 30px;
                font-style: italic;
                position: absolute;
                left: 0px;
                top:-4px;
              }
            }
          }
        }
      }
    }
  }
  &.UEFAEuro{//2016欧洲杯活动
    .UEFAEuro-topPic{
      height: 542px;
      background: url("../images/activity/UEFAEuro2016/topbanner.jpg") center center;
      background-size: cover;
    }
    .UEFAEuro-Body{
      height: 685px;
      background: url("../images/activity/UEFAEuro2016/bg.jpg") center center;
      background-size: cover;
      .container{width: 1068px;background-color: #03366d;color: $c-f;border-radius: 4px;}
      .UEFAEuro-Body-tit{
        height: 62px;
        border-bottom: 1px solid #175b97;
        ul.UEFAEuro-BodyTitUl{
          margin-left: 190px;
          @extend %clearfix;
          li{height: 62px;line-height: 62px;
            @extend %fl;
            font-size: 18px;
            padding: 0 28px;
            margin:  0 30px;
            cursor: pointer;
            &.active{
              background-color: #175b97;
            }
          }
        }
      }
      .UEFAEuro-BodyCon{
        @extend %clearfix;
        .item{display: none;
          &.active{display: block;}
        }
        .tabNextOrPrev{
          position: absolute;
          display: block;
          top:175px;
          width: 46px;
          height: 68px;
          background: url("../images/activity/UEFAEuro2016/pervOrNext.png") -999px -999px no-repeat #022b57;
          &.tabPrev{
            background-position: 0 -68px;
            left: 0;
          }
          &.tabNext{
            background-position: 0 0;
            right:0;
          }
        }
        .UEFAEuroGroupBtnBox{
          width: 78%;
          margin: 26px auto 0;
          border-top:1px solid #175b97 ;
          text-align: center;
          .UEFAEuroGroup-btn{
            display: inline-block;
            height: 55px;
            line-height: 55px;
            width: 155px;
            @extend %tc;
            font-size: 20px;
            border-radius: 4px;
            color: $c-f;
            margin:25px 14px 0;
            //border: #1c7cff 1px solid;
            &.btn-blue{
              background-color: #175b97;
            }
            &.btn-red{
              background-color: #d7213c;
            }
            &.disabled{
              background-color: $c-db;
              cursor: not-allowed;
            }
          }
        }
        .UEFAEuro-BodyConMain{
          @extend %fl;
        }
        .UEFAEuro-BodyItem,.UEFAEuro-BodyItem2{//display: none;
          position: relative;
          width: 690px;
          &.active{display: block;}
        }
        .UEFAEuro-BodyItem2{
          .UEFAEuroGroupBtnBox{
            .UEFAEuroGroup-btn{margin-top: 60px;}
          }
          .UEFAEuro-BodyItem2Tip{
            position: absolute;
            width: 100%;
            left: 0;
            @extend %tc;top:20px;
            font-size: 20px;
          }
        }
        .UEFAEuro-BodyItemUlBox{
          width: 580px;
          margin:20px 0 0 56px;
          @extend %clearfix;
          overflow: hidden;
          &.box3{
            margin: 100px auto 50px;
          }
        }
        ul.UEFAEuroGroupUl{
          width: 2320px;
          @extend %clearfix;
          li{
            width: 580px;
            float: left;
            text-align: center;
            .UEFAEuroGroup-con{
              margin-top: 14px;
            }
            .UEFAEuro-flag{
              cursor: pointer;
              margin: 0 24px;
              display: inline-block;
            }
            .UEFAEuroGroup-tit{font-size:20px;margin-top: 20px;}
            .UEFAEuroGroup-text{font-size: 14px;}
          }
        }
        @at-root .UEFAEuro-flag{
          $iconFlags:France,Romania,Albania,Switzerland,England,Russia,Wales,Slovakia,Germany,Ukraine,Poland,NorthernIreland,Spain,CzechRepublic,Turkey,Croatia,Belgium,Italy,RepublicOfIreland,Sweden,Portugal,Iceland,Austria,Hungary;
          @each $iconFlag in $iconFlags{
            &.#{$iconFlag}{
              .icon-flag{
                background: url("../images/activity/UEFAEuro2016/flag/#{$iconFlag}.png") no-repeat;
              }
            }
          }
          &.active{
            .UEFAEuroGroup-text{
              background-color: #d7213c;
            }
          }
          .icon-flag{
            display: block;
            width: 88px;
            height: 88px;
          }
          .UEFAEuroGroup-text{
            margin-top: 4px;
            border-radius: 4px;
            width: 76px;height: 30px;
            line-height: 30px;
            background-color: #155a97;
          }
        }
        //淘汰赛
        .UEFAEuroGroupVS-con{//vs
          position: relative;
          width: 96%;
          margin: 80px auto 30px;
          @extend %clearfix;
          .UEFAEuro-flag{
            @extend %fl;
            width: 140px;
            .icon-flag{margin: auto;}
            &.active{
              .UEFAEuroGroup-text{
                background-color: #CD2641;
                &:after{
                  background: url("../images/activity/UEFAEuro2016/yes.png") no-repeat;
                  position: absolute;
                  content: '';
                  width: 33px;
                  height: 34px;
                  right: 0;
                  bottom:0;
                }
              }
            }
            .UEFAEuroGroup-text{
              font-size: 20px;
              border:#1c7cff 1px solid;
              border-radius: 4px;
              color:$c-f ;
              display: block;
              white-space: nowrap;
              margin-top:20px;
              width: 140px;
              height: 52px;line-height: 52px;
              border: 0;
              background-color: #285B96;
              position: relative;
            }
            &.fr{
              @extend %fr;
            }
          }
          .UEFAEuroGroupVS-Box{
            position: absolute;
            left: 50%;
            width: 120px;
            top: 20px;
            margin:0 0 0 -60px;
            time{display: block;
              color: $c-f;
              font-size: 26px;
              &.date{
                color: $c-f;
                font-size: 20px;
                padding: 4px 0;
              }
            }
            .UEFAEuroGroupVS-footertext{
              font-size: 30px;
              color: #c9c9c9;
            }
          }
        }
        .UEFAEuro-countdown{//倒计时
          width: 290px;height: 38px;
          line-height: 38px;
          @extend %tc;
          background-color: #155a97;
          font-size: 16px;
          span.icon-time{
            width: 15px;
            height:15px;
            background: url("../images/activity/UEFAEuro2016/timeIcon.png") no-repeat;
            display: inline-block;
            vertical-align: middle;
            margin-right:8px ;
          }
          //color: $c-f;
        }
        .UEFAEuro-BodyConAside{
          position: relative;
          color: #cdd7e2;
          margin: 20px 0;
          @extend %fr;
          height: 480px;
          width: 320px;
          padding: 40px 30px 0 20px;
          font-size: 14px;
          border-left: #175b97 1px solid;
          .tit{margin-top: 20px;}
        }
        .UEFAEuro-BodyConRecord{//竞猜记录
          height: 520px;
          margin:30px 40px;
          @extend %tc;
          .multRecordBox-tit{
            margin-top: 10px;
            font-size: 18px;
            height: 36px;line-height: 36px;
            background-color: #0e4a84;
            @extend %clearfix;
            .row-3{text-indent: 0;}
          }
          //.row-3{width: 32.7%;}
          .multRecordBox-con1{overflow: hidden;}
          .multRecordBox-con{
            max-height: 160px;
            overflow-y: auto;
            .row-3{text-indent: 17px;
              *width:33.3%;
            }
          }
          .multRecordBox-con3{
            padding-bottom: 60px;
            overflow: hidden;
            .multRecordBox-con-row {
              &.active {
                background-color:transparent;
                span.icon-champion{display: inline-block;padding: 0;}
              }
            }
          }
          span.icon-champion{
            display: none;
            width: 16px;
            height: 16px;
            background: url("../images/activity/UEFAEuro2016/champion.png") no-repeat;
            background-size:100% ;
            vertical-align: middle;
            margin-right: 6px;
          }
          .multRecordBox-con-row{
            height: 40px;
            line-height: 40px;font-size: 14px;
            span{padding: 0 6px;}
          }
          .youVote{//记录-您的投票
            height: 24px;
            //padding: 0 12px;
            line-height: 24px;
            text-align: center;
            display: inline-block;
            span.icon-yes{padding: 0;
              display: none;
              width: 11px;
              height: 8px;
              background: url("../images/activity/UEFAEuro2016/yesIcon.png") no-repeat;
              background-size: 100%;
              vertical-align: middle;
              margin-left: 4px;
            }
            &.active{
              background-color: #f83451;
              padding-right: 10px;
              span.icon-yes{display: inline-block;}
            }
          }
        }
        .multRecordBox-titPrompt{
          font-size: 16px;
          @extend %tl;
          margin-top: 20px;
        }
        ul.multRecordBox-con1Ul1,ul.multRecordBox-con1Ul2{
          overflow: hidden;
          margin:10px auto 0;
          @extend %clearfix;
          li{@extend %fl;
            width: 100px;
            margin: 10px 10px;
            line-height: 40px;
            background-color:darken(#0e4a84,3%);
            &.active{
              background-color: #d7213c;
            }
          }
        }
        ul.multRecordBox-con1Ul1{
          margin-left: -10px;
        }
        ul.multRecordBox-con1Ul2{
          margin-right: -10px;
          margin-left: 20px;
          li{@extend %fl;}
        }
        .noUEFAEuroActivity-text{//暂无记录
          height: 560px;
          line-height: 140px;
          @extend %tc;
        }
      }
    }
  }
  &.groupon{//爱康团团
    .topbanner{
      height: 412px;
      width: 100%;
      position: relative;
      background-color: #fe4f4c;
    }
    ul.groupon-partakeUl{
      display: none;
      &>li{
        height: 36px;line-height: 36px;color: $c-6;
        overflow: hidden;
        .groupon-partake-l,.groupon-partake-c,.groupon-partake-r{@extend %fl;}
        .groupon-partake-l{width: 36%;}
        .groupon-partake-c{width: 20%;@extend %tc;}
        .groupon-partake-r{width: 26%;@extend %tc;}
      }
    }
  }
}
//高温活动
.activity-heatCompensation{
  background: url("../images/activity/heatCompensation/bg.jpg") center center no-repeat;
  overflow: hidden;
  .body-box{
    width: 91.2%;
    margin:-60px auto 0;
    position: relative;
    z-index: 1;
  }
  .body-bg{
    background-color: #caeab9;
    border-radius: 10px;
    box-shadow: 0 2px 8px 0 #28a576;
    margin-bottom: 20px;
  }
  .body-t{
    height: 240px;
  }
  .body-t-box{
    overflow: hidden;
  }
  .row-2{
    position: relative;
    margin-top: 25px;
    height: 148px;
  }
  .icon-heat{
    width: 127px;
    height: 127px;
    position: absolute;
    top:25px;left:40px;
    &.icon-1{
      background: url("../images/activity/heatCompensation/icon-1.png") no-repeat;
      background-size: cover;
    }
    &.icon-2{
      background: url("../images/activity/heatCompensation/icon-2.png") no-repeat;
      background-size: cover;
    }
  }
  .body-t-tit{
    font-size: 21px;
    color: $c-6;
    margin: 40px 0 0 180px;
  }
  .body-t-text{
    font-size:36px;
    color: #ff0000;
    margin:10px 0 0 180px;
    em{
      font-size: 21px;
    }
  }
  .body-t-b{
    font-size:21px;
    color: $c-6;
    margin-top: 15px;
    text-align: center;
  }
  .body-c{
    height: 280px;
    text-align: center;
  }
  .body-c-tit{
    height: 106px;
    line-height: 106px;
    font-size: 36px;
    color: $c-6;
    position: relative;
    &::after,&::before{
      position: absolute;
      content: '';
      top:50%;
      left:50%;
      transform: translate(-50%,-50%);
    }
    &::before{
      width: 46px;
      height: 46px;
      background: url("../images/activity/heatCompensation/icon-3.png") no-repeat;
      background-size: contain;
      margin-left: -6em;
    }
    &::after{
      width: 89px;
      height: 81px;
      background: url("../images/activity/heatCompensation/icon-4.png") no-repeat;
      background-size: contain;
      margin-left: 6em;
      top:60%;
    }
  }
  .body-c-con{
    font-size: 24px;
    color: #ff0000;
  }
  .body-c-btn{
    width: 250px;
    height: 70px;
    margin: 30px auto 0;
    line-height: 60px;
    font-size: 30px;
    color: #a85402;
    background: url("../images/activity/heatCompensation/btn-bg.png") no-repeat;
    background-size: cover;
  }
  .rule-tit{
    color: $c-f;
    font-size: 20px;
    text-indent: 50px;
    margin-top: 30px;
  }
  .rule-con{
    padding:0 0 50px 50px;
    p{color: $c-f;
      font-size: 14px;
    }
  }
}
//app上线活动页面
.appIssued{
  background-color: $c-f;
  .w100{width: 100%;display: block;}
  .appIssued-item{
    &.item1{
      .w100{
        &.item1BigBg{
          min-height: 590px;
        }
      }
      .appIssued-itemCon{
        //background: url("../images/activity/appIssued/item1.png") center center no-repeat;
        //background-size: 100% 100%;
        //height: 739px;
        //width: 100%;
      }
      .appIssued-itemBodyCon{
        color: $c-f;
        position: absolute;
        top:14%;left: 50%;
        margin-left: -100px;
        .appIssued-tit{
          font-size: 66px;
          font-weight: 900;
          text-indent: -26px;
        }
        .appIssued-smallTit{
          font-size: 60px;
          font-weight: lighter;
          margin-top: 6px;
        }
        .btnBox{
          @extend %clearfix;
          margin-top: 40px;
        }
        .ewm{width: 138px;height: 138px;margin-right: 30px;}
        .appIssued-btn{
          display: block;
          width: 198px;
          height: 58px;
          border: #fe5e02 1px solid;
          border-radius: 6px;
          background: url("../images/activity/appIssued/btn-icon.png") no-repeat -999px -999px;
          &:hover{
            background-color: #fe5e02;
          }
          &.btn-iphone{
            background-position: 0 0;
            &:hover{
              background-position: 0 -58px;
            }
          }
          &.btn-android{
            margin-top: 20px;
            background-position: 0 -116px;
            &:hover{
              background-position: 0 -174px;
            }
          }
        }
      }
      .item1footer{
        position: absolute;
        width: 100%;
        bottom: 0;
        left: 0;
      }
    }
    &.item2{
      .appIssued-itemCon{
        height:435px;
        z-index: 3;
      }
      .appIssued-itemBodyCon{
        position: absolute;
        top:25%;
        left: 50%;
        margin-left: -510px;
      }

      .appIssued-tit{
        font-size: 60px;
        color: $c-3;
      }
      .appIssued-smallTit{
        font-size: 36px;
        color: $c-6;
        margin-top: 10px;
      }
      .img-item2{
        width: 411px;
        height: 707px;
        background: url("../images/activity/appIssued/item2.png") no-repeat;
        position: absolute;
        top:-150px;
        left: 50%;
        margin-left: 100px;
      }
    }
    &.item3{
      .item3top{
        position: absolute;
        width: 100%;
        top: 0;
        left: 0;
      }
      .item3footer{
        position: absolute;
        width: 100%;
        bottom: 0;
        left: 0;
      }
      .appIssued-itemCon {
        width: 100%;
        height: 760px;
        background: url("../images/activity/appIssued/item3Bg.png") center center repeat-y;
      }
      .appIssued-itemBodyCon{
        position: absolute;
        color: $c-f;
        top:39%;left: 50%;
        margin-left: 30px;
      }
      .appIssued-tit{
        font-size: 60px;
      }
      .appIssued-smallTit{
        font-size: 36px;
        margin-top: 10px;
      }

      .img-item3{
        width: 529px;
        height: 744px;
        background: url("../images/activity/appIssued/item3.png") no-repeat;
        position: absolute;
        bottom:20px;
        left: 50%;
        margin-left: -610px;
      }
    }
    &.item4{
      .appIssued-itemCon {
        width: 100%;
        height: 450px;
        //z-index: 3;
      }
      .appIssued-itemBodyCon{
        position: absolute;
        top:39%;left: 50%;
        margin-left: -520px;
      }
      .appIssued-tit{
        color: $c-3;
        font-size: 60px;
      }
      .appIssued-smallTit{
        color: $c-6;
        font-size: 36px;
        margin-top: 10px;
      }
      .img-item4{
        width: 657px;
        height: 760px;
        background: url("../images/activity/appIssued/item4.png") no-repeat;
        position: absolute;
        top:-20px;
        left: 50%;
        margin-left: 100px;
      }

    }
    &.item5{
      .appIssued-itemCon{}
      .appIssued-itemBodyCon{
        position: relative;
        @extend %clearfix;
        color: $c-6;
        font-size: 40px;
        height: 376px;background-color: $c-ea;
        img{width: 260px;height: 260px;
          display: block;
          position: absolute;
          top:46px;
          left: 50%;margin-left: -380px;
        }
        .ewmBox-text{
          line-height: 60px;
          position: absolute;
          top:120px;
          left: 50%;margin-left: -30px;
        }
      }
    }
  }
  .appIssued-itemCon{position: relative;

  }
}
//宣传视频
.campaign{
  margin: 50px 0;
  .campaignBox{
    height: 550px;
  }
}
//2.0























